web-dev-qa-db-ja.com

jqueryを使用してチェックボックスをオン/オフにしますか?

私は自分のページにいくつかのテキスト入力フィールドを持っていて、JavaScriptを使ってそれらの値を表示しています。

値の編集、チェックボックスフィールドの追加、値の受け渡しには.set("value","")関数を使用しています。

ここで私はvalue == 1なら、このチェックボックスをチェックするべきであることをチェックしたいです。それ以外の場合は、チェックしないでください。

私はこれを2つのdivを使用して行いましたが、私はそれに慣れていません。他に解決策はありますか?

if(value == 1) {
    $('#uncheck').hide();
    $('#check').show();
} else{
    $('#uncheck').show();
    $('#check').hide();
}
549
Irfan Ahmed

jQuery 1.6以降の場合:

.attr() はプロパティには推奨されません。代わりにnew .prop() 関数を使用してください。

$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it

jQuery <1.6の場合:

チェックボックスをチェック/チェック解除するには、属性checkedを使用してそれを変更します。 jQueryを使えば、次のことができます。

$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it

HTMLでは、次のようになります。

<input type="checkbox" id="myCheckbox" checked="checked" /> <!-- Checked -->
<input type="checkbox" id="myCheckbox" /> <!-- Unchecked -->

ただし、チェックボックスの値を取得するために.attr()メソッドを信頼することはできません(必要な場合)。 .prop() メソッドに頼る必要があります。

1163
Eric

prop() を使用することができます。 jQuery 1.6 より前のバージョンでは、 .attr() メソッドで属性の取得時にプロパティ値が考慮されることがありました。 。 jQuery 1.6 以降、.prop()メソッドは明示的にプロパティ値を取得する方法を提供しますが、.attr()は属性を取得します。

var prop=false;
if(value == 1) {
   prop=true; 
}
$('#checkbox').prop('checked',prop);

または 単純に、

$('#checkbox').prop('checked',(value == 1));

スニペット

$(document).ready(function() {
  var chkbox = $('.customcheckbox');
  $(".customvalue").keyup(function() {
    chkbox.prop('checked', this.value==1);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h4>This is a domo to show check box is checked
if you enter value 1 else check box will be unchecked </h4>
Enter a value:
<input type="text" value="" class="customvalue">
<br>checkbox output :
<input type="checkbox" class="customcheckbox">
62
Rohan Kumar

値に基づいてチェックボックスの状態を設定できます。

$('#your-checkbox').prop('checked', value == 1);
26
billyonecan