jQuery：如果复选框被选中，toggleClass

我是一个jQuery noob，似乎我总是会一直试图让这个简单的东西工作。jQuery：如果复选框被选中，toggleClass

我想要的是，当复选框被选中时，用display: none;隐藏div。

这是jFiddle的例子，我正在搞一堆。

感谢您的帮助，或其他解决方案:)

2010-09-06 Kyle

我卡里姆同意，如果你只需要隐藏/显示，使用.toggle(bool)，如果你的例子被简化，你需要一个类，使用.toggleClass("class", bool)，像这样：

$(function(){ 
    $("#checkbox4").change(function() { 
    $("#checkout-shipping-address").toggleClass("show-hide", this.checked) 
    }).change(); 
});

You can test it out here，最后的.change()调用是使页面首次加载时的状态匹配，here's what I mean。

来源

2010-09-06 13:03:55

哇，谢谢！很好的解释和谢谢，例如。变更电话正是我所追求的。 :) – Kyle 2010-09-06 13:08:19

我的印象是，IE不能处理复选框上的更改，并且在使用空格键在某些浏览器中选中/取消选中时，它不一定会被解雇。相反，我会使用'click'并且用'triggerHandler（'click'）'设置初始状态。请看我的答案。 – karim79 2010-09-06 13:16:13

@ karim79 - 这是我第一次听说IE和“改变”......它在1.4.2之前有*冒泡*变化事件（造成'.live（）'问题），但是没有实际的复选框，我见过或听说过。我的上面的演示在IE8/7中没有任何问题，我没有6个方便的测试，但我没有看到它会失败，'onchange'在API中处于非常基本的级别:) – 2010-09-06 13:21:21

试试下面的代码：

$(function(){ 
    $('#checkbox4').change(function() { 
     $("#checkout-shipping-address").toggleClass("show-hide"); 
    }); 
});

您需要将change或click事件，以反应进行绑定。

来源

2010-09-06 13:00:59 jwueller

有没有需要一个show-hide类。只是传递一个布尔值切换，并通过使用triggerHandler设置div的初始状态，它可以让你火绑定到一个元素的事件处理程序，而不会实际影响该元素的状态：

$(document).ready(function() { 
    $("#checkbox4").click(function() { 
     $("#checkout-shipping-address").toggle(this.checked); 
    }).triggerHandler('click'); 
});

演示：http://jsfiddle.net/nQnDG/3/

来源

2010-09-06 13:01:11 karim79

jQuery：如果复选框被选中，toggleClass

回答

相关问题