チェックされていないチェックボックスの値を取得できません

Question

まず、質問をする前によくお聞きしてから、&エラーを試してみてください。私は未チェックのチェックボックスを含むjqueryから値を投稿しようとしました。私は多くの方法を試みたが、それでも私のコードの構造のために、それが動作するように管理していない。

function toggle_tip() {} 
 
$('#l_sync_ul').click(function() { 
 
    if ($('#l_sync_ul').prop("checked") == undefined) { 
 
    $('#l_sync_ul').after('<input type="hidden" name="' + $('#l_sync_ul').attr("l_sync_ul") + '" value=off>') 
 
    } else { 
 
    $('#l_sync_ul').next().remove(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<input name="l_sync_ul" id="l_sync_ul" onclick="toggle_tip('ul_dept')" type="checkbox">

私はテーブルのトグルのためにそれを使用していますので、単に「onclicks」属性を無視：ここに私は現在しようと試みの一つです。

Answer 1

あなたが欲しいものを100％わからないが、これは

$('#l_sync_ul').click(function() { 
 
    if (!$(this).is(":checked")) { 
 
    $(this).after('<input type="hidden" name="' + $(this).attr("name") + '" value=off>') 
 
    } else { 
 
    $(this).next().remove(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<input name="l_sync_ul" id="l_sync_ul" type="checkbox">

が、なぜ隠しフィールドを持っており、無効にしない/有効

よりよく動作しますそれはクリックで？またはそれ以上：チェックされていない場合は送信されません。サーバーまたはAjaxを使用している場合はAjaxで対処する -

Answer 2

.prop("checked")はtrueまたはfalseを返します。 jQueryを使用しているので、それを使用してchangeイベントハンドラを直接バインドすることをお勧めします。

$('#l_sync_ul').change(function() { 
 
    if (!this.checked) { 
 
    $(this).after('<input type="hidden" name="' + $(this).attr("name") + '" value=off>') 
 
    } else { 
 
    $(this).next().remove(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<input name="l_sync_ul" id="l_sync_ul" type="checkbox">*Just ignore the 'onclicks' attribute since I'm using it for toggle the table.*

Answer 3

$('#l_sync_ul').prop("checked")自体ブール、undefinedをチェックする必要はありません。

checkboxを.changeイベントリスナーで追跡できます。

function toggle_tip() {} 
 
$(document).ready(function() { 
 
    $('#l_sync_ul').click(function() { 
 
    if ($('#l_sync_ul').prop("checked")) { 
 
     console.log("Checked"); 
 
     $('#l_sync_ul').after('<input type="hidden" name="' + $('#l_sync_ul').attr("l_sync_ul") + '" value=off>') 
 
    } else { 
 
     console.log("Un Checked"); 
 
     $('#l_sync_ul').next().remove(); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<input name="l_sync_ul" id="l_sync_ul" onclick="toggle_tip('ul_dept')" type="checkbox">

Answer 4

最新の編集に基づいて、私は$(this).next().remove(); with $('input[value=off]').remove();を置き換えますので、value=offの要素はすべて削除されます。それは特定の状況で動作し、その逆もあります。ここを参照してください：

スクリプト

$(':checkbox').change(function() { 
    if (!this.checked) { 
    $(this).after('<input type="hidden" name="' + $(this).attr("name") + '" value=off>') 
    } else { 
    $('input[value=off]').remove(); 
    } 
}); 

をHTML

<input type="hidden" name="l_sync_ul" value=off> 
<input type="checkbox" name="l_sync_ul" id="l_sync_ul" onclick="toggle_tip('ul_dept')">