ラベルとチェックボックスがあります。ラベルをクリックすると、目的のアクションが実行されます。チェックボックスは何もしません。有効にするか無効にするかはクリックしないでください。私は入力の内側と外側の両方にラベルを移動しましたが、何も動かないようです。すべてのコードは以下の通りです。チェックボックスは機能しませんが、ラベルは
home_filters.html.erb:
<span id="listing-search-sentence-transit" style="display: none;">I'd like to live near <a tabindex="0" class="button btn-transparent" id="listing-transit-selector" role="button" data-toggle="popover">these trains.</a></span>
<span id="listing-search-sentence-fee" style="display: none;">Only find me <a tabindex="0" class="button btn-transparent" id="listing-no-fee-selector" role="button" <%= f.check_box :no_fee %> <%= f.label :no_fee, "no fee listings." %> </a></span>
<span id="listing-search-sentence-pets" style="display: none;"> <a tabindex="0" class="button btn-transparent" id="listing-pets-selector" role="button" data-toggle="popover"><%= f.label :pets %></a></span>
<div id="test-content" class="hide">
<div class="container-fluid">
<label id="label-sentence-fee" class="general-text-label" for="sentence-fee"><input type="checkbox" name="label-sentence-fee" id="sentence-fee"> No Fee Listing</label><br>
<label id="label-sentence-transit" class="general-text-label" for="sentence-transit"><input type="checkbox" name="label-sentence-transit" id="sentence-transit"> Transit</label><br>
<label id="label-sentence-pets" class="general-text-label" for="sentence-pets"><input type="checkbox" name="label-sentence-pets" id="sentence-pets"> Pets</label><br>
</div>
</div>
.jsファイル:
$("#sentence-fee").click(function(feeEvent){
feeEvent.stopPropagation();
$("#listing-search-sentence-fee").toggle();
$("input#sentence-fee").prop('checked', true);
});
$("#sentence-transit").click(function(transitEvent){
transitEvent.stopPropagation();
$("#listing-search-sentence-transit").toggle();
$("input#sentence-transit").prop('checked', true);
});
$("#sentence-pets").click(function(petsEvent){
petsEvent.stopPropagation();
$("#listing-search-sentence-pets").toggle();
$("input#sentence-pets").prop('checked', true);
});
'$( "入力#文-料")小道具(真、 '確認') ;「なぜこれをするの?あなたはいつもクリックで入力をチェックしたがっていますか? – demo
@demo私はしません。ユーザーがボックスをチェックしたときのみ。 –
この行を削除した場合、$( "input#sentence-fee")。prop( 'checked'、true); 'あなたがexpextしますか?ユーザーがcheckBoxをクリックすると、チェックされます。もう一度 - それはチェックされていません。このようなものはhttps://jsfiddle.net/xk9toseq/ – demo