Question

我有一个功能，每当有人点击一个复选框时执行该功能，并且根据复选框是否被选中或取消选中，可能会发生不同的事情。但是，在表单提交后，将加载以前的值，并且我希望根据是否选中该框来应用相同的更改。这给我留下了两个相同的功能

示例代码：

// !- Bind checkboxes to show divs
        $('input[type="checkbox"]').bind("change", function(){
                if ($(this).is(":checked")) {
                    $("#"+$(this).data('toggle')).show();
                }
                else {
                    $("#"+$(this).data('toggle')).hide();
                }
        });

        // Init checkboxes which are already checked via previous selection
        $('input[type="checkbox"]').each(function(index){
                if ($(this).is(":checked")) {
                    $("#"+$(this).data('toggle')).show();
                }
                else {
                    $("#"+$(this).data('toggle')).hide();
                }

        });

http://jsfiddle.net/ms7EY/

我知道使用bind，你可以添加多个事件，但是每个函数都不是一个事件，我不知道如何清理它。我是否被迫创建一个单独的函数并继续使用bind（）和each（）但是对两者都使用回调或是否有更优雅的解决方案？

Answer 1

您可以使用.trigger()触发事件，它将执行与所选元素关联的所有更改事件处理程序

    $('input[type="checkbox"]').bind("change", function(){
            if ($(this).is(":checked")) {
                $("#"+$(this).data('toggle')).show();
            }
            else {
                $("#"+$(this).data('toggle')).hide();
            }
    }).trigger('change'); //or .change()

演示：Fiddle

Answer 2

您可以使用以下方式“模拟”更改事件，而不是每个人：

$('input[type="checkbox"]').trigger('change')

小提琴：http://jsfiddle.net/ms7EY/2/

结合变更事件和每个功能

2 个答案: