jquery設定チェックボックスがオン

私はすでに可能な方法をすべて試しましたが、それでも機能しませんでした。モーダルウィンドウがありcheckbox、モーダルが開いたときに、checkboxチェックまたはチェック解除がデータベースの値に基づいている必要があります。（私はすでに他のフォームフィールドを操作しています。）チェックを開始しようとしましたが、機能しませんでした。

私のhtml div：

<div id="fModal" class="modal" >
    ...
    <div class="row-form">
        <div class="span12">
            <span class="top title">Estado</span>

          <input type="checkbox"  id="estado_cat" class="ibtn">
       </div>
    </div>             
</div>

そしてjquery：

$("#estado_cat").prop( "checked", true );

私もを試してattrみましたが、他の人たちもここのフォーラムで見かけましたが、どれも機能していないようです。誰かが私を正しい方向に向けることができますか？

編集：わかりました、ここに何か不足しています...チェックボックスがページにある場合は、コードを使用してチェック/チェック解除できますが、モーダルウィンドウにある場合はできません。何十通りもの方法を試しました...

モーダルを開くはずのリンクがあります。

そして、jqueryはクリックを「リッスン」して、データベースからのデータをテキストボックスに入力するなどの操作を実行します。すべてが私が望むように機能しますが、問題は、コードを使用してチェックボックスをオン/オフに設定できないことです。助けてください！

$(function() {
 $(".editButton").click(function(){
       var id = $(this).data('id'); 
       $.ajax({
          type: "POST",
          url: "process.php",
          dataType:"json",
          data: { id: id, op: "edit" },
        }).done(function( data ) {
//the next two lines work fine, i.e., it grabs the value from database and fills the textboxes
          $("#nome_categoria").val( data['nome_categoria'] );
          $("#descricao_categoria").val( data['descricao_categoria'] );
//then I tried to set the checkbox checked (because its unchecked by default) and it does not work
           $("#estado_cat").prop("checked", true);
        $('#fModal').modal('show');
});
    evt.preventDefault();
    return false;
    });     
});

'prop'関数を使用する必要があります。

.prop('checked', true);

jQuery 1.6より前（user2063626の回答を参照）：

.attr('checked','checked')

提案されたすべての回答を取り、私の状況に適用します-取得した値true（ボックスをチェックする必要があります）またはfalse（ボックスをチェックしないでください）に基づいてチェックボックスをオンまたはオフにしよう-上記のすべてを試し、使用したことがわかっ.prop（真、「確認」）と.prop（「確認」、偽の）正解でした。

まだコメントやアップ回答を追加することはできませんが、会話に追加するにはこれが十分に重要であると感じました。

取得した値「allDay」がtrueの場合、IDが「even_allday_yn」のチェックボックスをオンにするフルカレンダー修正のロングコードは次のとおりです。

if (allDay)
{
    $( "#even_allday_yn").prop('checked', true);
}
else
{
    $( "#even_allday_yn").prop('checked', false);
}

男は以下のコードを試してください：

$("div.row-form input[type='checkbox']").attr('checked','checked')

または

$("div.row-form #estado_cat").attr("checked","checked");

または

$("div.row-form #estado_cat").attr("checked",true);

「checked」属性は、チェックボックスが存在すると同時にチェックボックスを「チェック」します。したがって、チェックボックスをチェック/チェック解除するには、属性を設定/設定解除する必要があります。

チェックボックス：

$('#myCheckbox').attr('checked', 'checked');

ボックスをオフにするには：

$('#myCheckbox').removeAttr('checked');

チェック済みステータスをテストする場合：

if ($('#myCheckbox').is(':checked'))

それが役に立てば幸い...

モーダルウィンドウ（動的またはページ内）にいるので、次のコードを使用して目標を達成できます（サイトで同じ問題が発生し、これを修正した方法です）。

HTML：

<div class="content-container" style="text-align: right;">
    <input type="checkbox" id="QueryGroupCopyQueries">
    <label for="QueryGroupCopyQueries">Create Copies</label>                                                   
</div>

コード：

$.each(queriesToAddToGroup, function (index, query) {
    if (query.groupAddType === queriesGroupAddType.COPY) {

        // USE FIND against your dynamic window and PROP to set the value
        // if you are using JQUERY 1.6 or higher.
        $(kendoWindow).find("input#QueryGroupCopyQueries").prop("checked", true);

        return;
    }

上記の「kendoWindow」は私のウィンドウです（私のウィンドウは動的ですが、ページ内の要素に直接追加する場合もこれを行います）。データの配列（ "queriesToAddToGroup"）をループして、COPYの属性を持つ行があるかどうかを確認しています。もしそうなら、ユーザーがこのウィンドウから保存するときにその属性を設定するウィンドウ内のチェックボックスをオンにしたいと思います。

.attr("checked",true)
.attr("checked",false)

trueとfalseが引用符で囲まれていないことを確認してください。

以下のようなコードを書くことができます。

HTML

<input type="checkbox"  id="estado_cat" class="ibtn">

jQuery

$(document).ready(function(){
    $(".ibtn").click(function(){
        $(".ibtn").attr("checked", "checked");
    });
});

うまくいきますように。

この機能を使用して、GreaseMonkeyスクリプトでページのチェックボックスを自動的にチェックする場合は、checkedプロパティを設定するだけでは関連するアクションがトリガーされない場合があることに注意してください。その場合、チェックボックスを「クリック」すると、おそらくチェックされたプロパティも設定されます。

$("#id").click()

$("#divParentClip").find("#subclip_checkbox")[0].checked=true;

Findはarrayを返すため、項目が1つしかない場合でも[0]を使用して取得します

あなたがそれからfindを使わないなら

$("#subclip_checkbox").checked=true;

これは私のためにMozilla Firefoxでうまくいきました

私のために働いた：

$checkbok.prop({checked: true});

あなたはおそらくjQuery UIを使用しているのでこれを試してください（そうでない場合はコメントしてください）

 $("#fModal" ).dialog({
     open: function( event, ui ) {

     if(//some hidden value check which stores the DB value==expected value for
      checking the Checkbox)

         $("div.row-form input[type='checkbox']").attr('checked','checked');

    }
   });

$("#estado_cat").checkboxradio("refresh")チェックボックスで実行してみましたか？

これは機能します。

 $("div.row-form input[type='checkbox']").attr('checked','checked');

私もこの問題に遭遇しました。

これが私の古いコードが機能しない

if(data.access == 'private'){
     Jbookaccess.removeProp("checked") ; 
    //I also have tried : Jbookaccess.removeAttr("checked") ;
 }else{
    Jbookaccess.prop("checked", true)
}

これが現在動作している私の新しいコードです：

if(data.access == 'private'){
     Jbookaccess.prop("checked",false) ;
 }else{
    Jbookaccess.prop("checked", true)
}

したがって、重要な点は、機能する前に、checkedプロパティが存在し、削除されていないことを確認してください。

これは、最新バージョンのjqueryでreturn attr('checked')が返されるために発生'checked'しprop('checked')ますtrue。

<body>
      <input id="IsActive" name="IsActive" type="checkbox" value="false">
</body>

<script>
    $('#IsActive').change(function () {
         var chk = $("#IsActive")
         var IsChecked = chk[0].checked
         if (IsChecked) {
          chk.attr('checked', 'checked')
         } 
         else {
          chk.removeAttr('checked')                            
         }
          chk.attr('value', IsChecked)
     });
</script>

モーダルウィンドウを読み込んだ後で、チェックボックスをオンにします。ページを読み込む前にチェックボックスを設定していると思います。

$('#fModal').modal('show');
$("#estado_cat").attr("checked","checked");

私はこれがJqueryソリューションを要求することを知っていますが、単純なJavaScriptでこれを切り替えるのは非常に簡単であることを指摘しておきます。

var element = document.getElementById("estado_cat");
element.checked = 1;

現在および将来のすべてのバージョンで動作します。

<div class="custom-control custom-switch">
      <input type="checkbox" class="custom-control-input" name="quiz_answer" id="customSwitch0">
      <label class="custom-control-label" for="customSwitch0"><span class="fa fa-minus fa-lg mt-1"></span></label>
  </div>

idとfor属性をそれぞれインクリメントすることを忘れないでください。[動的に追加されたブートストラップ]チェックボックスの場合。

$(document).on('change', '.custom-switch', function(){
    let parent = $(this);
    parent.find('.custom-control-label > span').remove();
    let current_toggle = parent.find('.custom-control-input').attr('id');
    if($('#'+current_toggle+'').prop("checked") == true){
        parent.find('.custom-control-label').append('<span class="fa fa-check fa-lg mt-1"></span>');
    }
    else if($('#'+current_toggle+'').prop("checked") == false){
        parent.find('.custom-control-label').append('<span class="fa fa-minus fa-lg mt-1"></span>');
    }
})