3

私のコードは、semantic-ui チェックボックス モジュールを使用しています。私は4つのチェックボックスを持っています。コードは、すべてのチェックボックスがいつオフになるかを判断する必要があります。

チェックボックスの 1 つの HTML:

<div class="inline field">
  <div class="ui toggle checkbox insurance">
    <input type="checkbox" name="insurance">
      <label>Would You Like To Reduce Your Monthly Insurance Costs</label>
  </div>
</div>

Javascript:

var $services = $('.service-selection').find('.ui.checkbox'),
    $userData = $('.user-data');

function updateElements(elem, show) {
    ...

    // show second segment only when atleast one service checkbox is checked
    if ($services.filter(":checked").size() > 0) {
        $userData.removeClass('hidden');
    }
    else {
        $userData.addClass('hidden');
    }

}

$services.checkbox({
    'onEnable': function() {updateElements(this, true)},
    'onDisable': function() {updateElements(this, false)}
});

セマンティック ui は実際には、対応する要素のchecked属性を設定していないことがわかりました。inputしたがって、:checkedセレクターは失敗します。

私の質問は、それを行う方法ですか？

4

2 に答える 2

2

問題はサービスセレクター（$services）だと思います。要素内の入力要素で行う必要があり.ui.checkboxます

var $services = $('.service-selection').find('.ui.checkbox input')

また.size()、非推奨の使用です.length

if ($services.filter(":checked").length > 0) {
    $userData.removeClass('hidden');
}
else {
    $userData.addClass('hidden');
}
于 2013-11-15T04:09:22.663 に答える
0

それを行うための最も簡単な方法。

チェックボックスを使用してテキスト フィールドを有効または無効にするとします。したがって、次のようになります。

# Using CoffeeScript:
$("#signature_credit_with_coupon").on "change", ->
  if (@checked)
    $('#signature_coupon').attr 'disabled', false
    $('#signature_coupon').focus()
  else
    $('#signature_coupon').attr 'disabled', true
  return

# Using JavaScript with jQuery:
$("#signature_credit_with_coupon").on("change", function() {
  if (this.checked) {
    $('#signature_coupon').attr('disabled', false);
    $('#signature_coupon').focus();
  } else {
    $('#signature_coupon').attr('disabled', true);
  }
});

これはうまくいきます。

于 2016-06-10T17:05:03.420 に答える