jQuery onay kutusu işaretliyse


414

Aşağıda sadece aynı tr bir onay kutusu işaretlendiğinde tetiklemek istiyorum bir işlevi var. Lütfen bana neyi yanlış yaptığımı söyleyin, olağan yöntemler işe yaramıyor. Teşekkürler

JS

$(".add_menu_item_table").live('click', function() {
  var value_td = $(this).parents('tr').find('td.td_name').text();
  if ($('input.checkbox_check').attr(':checked')); {
    var newDiv = $('<div class="div_menu_button"></div>');
    var showDiv = $('<div id="show' + "0" + numShow++ + '" class="menu_button_info hidden"></div>');
    var toggleTrigger = $('<a id="toggleshow' + "0" + numToggle++ + '" data-target="#show' + "0" + numTarget++ + '" class="toggle_trigger actions">&nbsp;</a><div style="padding:5px"></div>');
    var menuForm = $('<form id="menu_edit_form' + "0" + numForm++ + '" class="menu_creation_form"></form>');
    $('#created_buttons_list').append(
      newDiv.text(value_td)
    );
    newDiv.wrap("<li></li>");
    newDiv.append(toggleTrigger);
    newDiv.append(showDiv);
    showDiv.append(menuForm);
    menuForm.html('<label for="navigation_label">Navigation Label</label><input id="navigation_label' + "0" + numLabelone++ + '" type="text" placeholder="Navigation Label" name="navigation_label"><label for="attribute">Attribute</label><input id="attribute' + "0" + numLabeltwo++ + '" type="text" type="text" placeholder="Attribute" name="attribute"><label for="url">URL</label><input id="url' + "0" + numLabelthree++ + '" type="text" type="text" placeholder="URL" name="url"><input type="button" value="Remove" class="button_link remove_button"> <input type="reset" value="Cancel" class="button_link">');
  }
});

var numToggle = 0;
var numShow = 0;
var numTarget = 0;
var numForm = 0;
var numLabelone = 0;
var numLabeltwo = 0;
var numLabelthree = 0;
<table width="316px" border="0" cellspacing="0" cellpadding="0" id="table-data">
  <tbody>
    <tr>
      <td width="20px"><input type="checkbox" style="width:20px;" value="1" name="checkbox"></td>
      <td width="200px"><a href="/admin/feedbackmanager/sortby/2/sortdesc/0">Page Name</a></td>
      <td width="20px"><a href="/admin/feedbackmanager/sortby/3/sortdesc/0">Add</a></td>
    </tr>
    <tr>
      <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td>
      <td class="td_name">Timeplot</td>
      <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td>
    </tr>
    <tr>
      <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td>
      <td class="td_name">Operations Manuals</td>
      <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td>
    </tr> 
  </tbody>
</table>

$('input.checkbox_check').checkeddöner trueo kontrol edilirse, falseaksi
Don Cheadle

1
@mmcrae, bu yanlış. JQuery nesnesinin özelliği yoktur checked. Sanırım demek $('input.checkbox_check')[0].checked
Paul

Yanıtlar:


1049
if ($('input.checkbox_check').is(':checked')) {

4
CoffeeScript'te:if $('#my_checkbox').is ':checked'
Dennis

11
Kod jQuery doc tarafından onaylandıktan, "a onay kutusu işaretli olup olmadığını belirlemek için çapraz tarayıcı uyumluluğu yolu özelliğini kullanmaktır if ( elem.checked )ya if ( $( elem ).prop( "checked" ) )ya if ( $( elem ).is( ":checked" ) )". bkz api.jquery.com/prop
Adrien

Performans hakkında konuşacaksak, bu yorumların bazıları doğrudan Clinton tarafından sorulan soruya eklenmeli ve mutlak en hızlı tavsiyenin bir kimlik eklemek olacağını öne
sürmelidir

128

jQuery 1.6 veya üstü için:

if ($('input.checkbox_check').prop('checked')) {
    //blah blah
}

bir onay kutusunun işaretli olup olmadığını belirlemenin tarayıcılar arası uyumlu yolu https://api.jquery.com/prop/ özelliğini kullanmaktır


8
".Prop () yöntemi, eşleşen kümedeki yalnızca ilk öğenin özellik değerini alır." bkz. api.jquery.com/prop
Adrien

57

$('#checkboxId').is(':checked')işaretli olup olmadığını kontrol etmek için bu

& bunu $("#checkboxId").prop('checked', true) kontrol etmek için

& bunu $("#checkboxId").prop('checked', false)kaldırmak için


2
Artı bir sonraki mantıksal adımı vermek için.
Jason

22

Yukarıdaki çözümlerin hiçbiri benim durumum gibi herhangi bir nedenden dolayı çalışmıyorsa, şunu deneyin:

  <script type="text/javascript">
    $(function()
    {
      $('[name="my_checkbox"]').change(function()
      {
        if ($(this).is(':checked')) {
           // Do something...
           alert('You can rock now...');
        };
      });
    });
  </script>

Bu çözüm benim için çalışıyor
jking

8

ATTR arasındaki ana farka bakın | PROP | IS aşağıda:

Kaynak: http://api.jquery.com/attr /

$( "input" )
  .change(function() {
    var $input = $( this );
    $( "p" ).html( ".attr( 'checked' ): <b>" + $input.attr( "checked" ) + "</b><br>" +
      ".prop( 'checked' ): <b>" + $input.prop( "checked" ) + "</b><br>" +
      ".is( ':checked' ): <b>" + $input.is( ":checked" ) + "</b>" );
  })
  .change();
p {
    margin: 20px 0 0;
  }
  b {
    color: blue;
  }
<meta charset="utf-8">
  <title>attr demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<input id="check1" type="checkbox" checked="checked">
<label for="check1">Check me</label>
<p></p>
 

 
</body>
</html>


7

Eğer kontrol :

$( "SELECTOR" ).attr( "checked" )  // Returns ‘true’ if present on the element, returns undefined if not present
$( "SELECTOR" ).prop( "checked" ) // Returns true if checked, false if unchecked.
$( "SELECTOR" ).is( ":checked" ) // Returns true if checked, false if unchecked.

İşaretli val'i alın :

$( "SELECTOR:checked" ).val()

Kontrol edilen val numaralarını alın :

$( "SELECTOR:checked" ).length

Onay kutusunu işaretleyin veya işaretini kaldırın

$( "SELECTOR" ).prop( "disabled", false );
$( "SELECTOR" ).prop( "checked", true );

$( "SELECTOR:checked" ).val()on value="on", işaretliyse "açık" ve işaretlenmemişse "" verir - kullanışlı!
Fanky
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.