如何在复选框更改单击时唯一标识 jQuery 函数

How to uniquely identify the jQuery function on checkBox change click?

本文关键字:唯一 标识 jQuery 函数 单击 复选框      更新时间:2023-09-26

在我的程序中,我一次显示一个问题,下次单击它是发布并得到第二个问题。但是我为 Jquery 中的每个问题的复选框列表应用了一些逻辑,我像这样称呼它

 $(document).ready(function () {

        $("input:checkbox").change(function () {
            var txt = $(this).parent().children("label").text();
            if ($(this).is(':checked')) {
                if ($(this).parent().children("label").text() == 'Not Sure') {
                    $("input:checkbox").attr('checked', false);
                    $("input:checkbox").attr('disabled', true);
                    $(this).attr('checked', true);
                    $(this).attr('disabled', false);
                }
            }
            else {
                if ($(this).parent().children("label").text() == 'Not Sure') {
                    $("input:checkbox").attr('checked', true);
                    $("input:checkbox").attr('disabled', false);
                    $(this).attr('checked', false);
                }
            }
        });

        $("input:checkbox").change(function () {
            var txt = $(this).parent().children("label").text();
            if ($(this).is(':checked')) {
                if (txt == 'Not Sure' || txt == 'We Are Large Business' || txt == 'None of these apply') {
                    $("input:checkbox").attr('checked', false);
                    $("input:checkbox").attr('disabled', true);
                    $(this).attr('checked', true);
                    $(this).attr('disabled', false);
                }
            }
            else {
                if (txt == 'Not Sure' || txt == 'We Are Large Business' || txt == 'None of these apply') {
                    $("input:checkbox").attr('checked', false);
                    $("input:checkbox").attr('disabled', false);
                    $(this).attr('checked', false);
                }
            }
        });
    });

所以问题是,对于一个问题,逻辑与另一个复选框列表问题不同,我需要调用适当的函数,如你上面在 document.ready 中看到的那样有两个函数。那么对于某些特定问题,我应该如何修复函数调用呢?

在每个

帖子中使用jQuery取消绑定函数来删除事件处理程序绑定。作为参考,请看一下。

您可以使用一些自定义事件并根据问题触发适当的事件,这里有一些代码:

$(document).ready(function () {
    $("input:checkbox").on("someQuestions", function () {
        var txt = $(this).parent().children("label").text();
        if ($(this).is(':checked')) {
            if ($(this).parent().children("label").text() == 'Not Sure') {
                $("input:checkbox").attr('checked', false);
                $("input:checkbox").attr('disabled', true);
                $(this).attr('checked', true);
                $(this).attr('disabled', false);
            }
        }
        else {
            if ($(this).parent().children("label").text() == 'Not Sure') {
                $("input:checkbox").attr('checked', true);
                $("input:checkbox").attr('disabled', false);
                $(this).attr('checked', false);
            }
        }
    });
    $("input:checkbox").on("anotherQuestions", function () {
        var txt = $(this).parent().children("label").text();
        if ($(this).is(':checked')) {
            if (txt == 'Not Sure' || txt == 'We Are Large Business' || txt == 'None of these apply') {
                $("input:checkbox").attr('checked', false);
                $("input:checkbox").attr('disabled', true);
                $(this).attr('checked', true);
                $(this).attr('disabled', false);
            }
        }
        else {
            if (txt == 'Not Sure' || txt == 'We Are Large Business' || txt == 'None of these apply') {
                $("input:checkbox").attr('checked', false);
                $("input:checkbox").attr('disabled', false);
                $(this).attr('checked', false);
            }
        }
    });
    $("input:checkbox").change(function(){
        // apply some logic to find out if is one question or another
        if ( someQuestion ) {
            $(this).trigger("someQuestions");
        } 
        else {
            $(this).trigger("anotherQuestions");
        }
    });
});

希望对您有所帮助