Question

我想知道为什么这个简单的开关不起作用。

复选框的html为：

<input type="checkbox" id="use_billing" value="1" />

虽然文档中的jquery（就绪）是：

$j('#use_billing').change(function(){


    switch ($j(this).val())
    {

    case '1':

        $j('#gift_to').slideUp();

    break;

    default:

        $j('#gift_to').slideDown();
    break;
    }

});

如果我选中此框，我的div id #gift_to会执行slideUp。然而，取消选中没有任何反应......我错过了什么？

Answer 1

您应该致电is(':checked')。

例如：

if($j(this).is(':checked'))
    $j('#gift_to').slideUp();
else
    $j('#gift_to').slideDown();

或者，如果你想要聪明，

$j('#gift_to')[$j(this).is(':checked') ? 'slideUp' : 'slideDown']();

Answer 2

这会奏效。但是，我不确定为什么.val（）不能用于未选中的复选框。

$j('#use_billing').change(function(){

    if ($(this).is(":checked")) {
        $j('#gift_to').slideUp();
    } else {
        $j('#gift_to').slideDown();
    }
});

Answer 3

使用此代码，看看它是否有效

$('#use_billing').change(function(){
  if($(this).is(":checked")){
     $('#gift_to').slideUp();
  } else {
     $('#gift_to'). slideDown();
  }
});

Answer 4

因为没有人真正解释过原因：无论是否检查输入，复选框的值始终为“1”。这是被检查的状态，正在改变为SLaks，jessegavin＆amp; GeekTantra指出。

Answer 5

元素的value属性始终为"1"，无论是否已选中。

我建议您只看一下checked属性，而不是像所有人建议的那样使用.is选择器调用:checked方法：

$j('#use_billing').change(function(){
  if (this.checked) {
    $j('#gift_to').slideUp();
    return;
  }
  $j('#gift_to').slideDown();
})

或者简单地说：

$j('#use_billing').change(function(){
  $j('#gift_to')[this.checked ? 'slideUp' : 'slideDown']();
});

为什么这个简单的复选框在jquery中切换不起作用？

5 个答案: