jqueryでチェックボックスがオフになっていない理由

Question

チェックボックスをオフにする必要があります。アラートやdivを削除するようなことはすべてやっているが、チェックボックスをオフにしない。私はattrとpropの両方の方法を使用しました。チェックボックスidはOKです。 Firebugコンソールにもエラーは表示されません。提供

$('html').on('click', '#inScopeDiv .remButton', function() { 
     var currId = $(this).attr('id'); 
     var chkBoxId = "#chk"+currId; 
     alert(currId); 
     alert('#chk'+currId); 
     $(chkBoxId).prop("checked", false); 
     $(chkBoxId).attr("checked", false); 
     $('#div'+ currId).remove(); 
     $('#inScopeActionDiv' + currId).remove();   
    }); 

HTML :: &チェックボックスは以下の通りです

<c:forEach items="${data.inScope}" var="inScopeValues"> 
     <div class="col-md-12" style="background-color: snow;"> 
      <input class="inScope" type="checkbox" id="chk${inScopeValues.key}" name="chk + ${inScopeValues.key}" value="${inScopeValues.value}"> 
      ${inScopeValues.value} 
     </div> 
     </c:forEach> 

ボタン::>

<input class="inScope" type="checkbox" id="chkisc_2" name="chkisc_2" value="In Scope 2"> 

<button id="chkisc_1" type="button" class="btn btn-warning btn-sm remButton" title="Remove this item">Remove Item</button> 

Answer 1

あなたが更新され、質問に表示ボタンid="chkisc_1"、そしてあなたの関数では、あなたがそれを取ると、それの始まりだろうに#chkを追加していますセレクタ"#chkchkisc_1"で要素を探していることを意味します。一方、チェックボックスにはid="chkisc_2"がありますが、ループ内に作成されているようですが、おそらく_1もあります（これは同じIDを持つ要素が複数あることを意味しますが、無効なhtmlです）。

あなたのJSが#chkを追加したとき、それは#chkisc_1を探しています変更id="isc_1"を持っているボタン、：

$('html').on('click', '#inScopeDiv .remButton', function() { 
 
    var currId = $(this).attr('id'); 
 
    var chkBoxId = "#chk"+currId; 
 
    $(chkBoxId).prop("checked", false); 
 
    $('#div'+ currId).remove(); 
 
    $('#inScopeActionDiv' + currId).remove();   
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="inScopeDiv"> 
 

 
<input class="inScope" type="checkbox" id="chkisc_1" name="chkisc_1" value="In Scope 1" checked> 
 
<button id="isc_1" type="button" class="btn btn-warning btn-sm remButton" title="Remove this item">Remove Item</button> 
 

 
<input class="inScope" type="checkbox" id="chkisc_2" name="chkisc_2" value="In Scope 2" checked> 
 
<button id="isc_2" type="button" class="btn btn-warning btn-sm remButton" title="Remove this item">Remove Item</button> 
 
</div>

Answer 2

あなたはこれを達成するためにprop()とremoveAttr()を使用する必要があります...それを願っています助けて！

var cb = $("#checkbox") 
 

 
$('#button1').click(function() { 
 
    cb.prop("checked", true) 
 
}) 
 

 
$('#button2').click(function() { 
 
    cb.removeAttr('checked') 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="checkbox" />This is a checkbox 
 
<br /> 
 
<br /> 
 
<button id="button1">Check checkbox</button> 
 
<br /> 
 
<br /> 
 
<button id="button2">Uncheck checkbox</button>

Answer 3

let checkbox = document.querySelector("input"); 
 

 
checkbox.addEventListener("click",function(){ 
 
    console.log("Sorry (͡° ͜ʖ ͡°)"); 
 
    this.checked = false; 
 
});

<input type="checkbox" />