代码之家  ›  专栏  ›  技术社区  ›  Patrick

.on(单击),属性设置不起作用

  •  0
  • Patrick  · 技术社区  · 10 年前

    我正在尝试在复选框上设置一个“checked”属性。

    代码:

    $(".ui.toggle" ).on( "click", function() {
    
      if ($('#ownplace').not(':checked')) {
        $('#ownplace').attr('checked', true );
      }
      else {
        $('#ownplace').prop('checked', false);
      }
    
    });
    

    它可以选中该框,但不会取消选中。我尝试了多种解决方案,包括使用attr而不是prop,是的,我进行了一次搜索,但似乎没有什么能够澄清这个特定问题。

    编辑

    如果选中复选框,我需要能够捕获,如下所示:

    if($data['ownplace'] == checked) {
          $user->ownplace = $data['ownplace'];
     }
    

    这项工作: $('#ownplace').prop('checked', !$('#ownplace').is(':checked')); 但它没有在字段上设置checked属性,所以我无法检查它是否被选中。

    所有解决方案均未设置 checked="checked" 在输入字段上,以便 on click <input class="ownplace" type="checkbox"> <input class="ownplace" type="checkbox" checked="checked"> .

    这个 .prop 不会这样做,我想只会切换css。

    5 回复  |  直到 10 年前
        1
  •  1
  •   kapantzak    10 年前

    使用 prop() 改为函数:

    $('#ownplace').prop('checked', true );
    

    解释

    如果要检查复选框的状态使用 is(:checked)

    if (!$('#ownplace').is(':checked')) {
       $('#ownplace').prop('checked', true );
    }
    
        2
  •  1
  •   Ehsan    10 年前

    更改:

     $('#ownplace').attr('checked', true );
    

    收件人:

     $('#ownplace').prop('checked', true );
    
        3
  •  0
  •   Sooraj    10 年前

    你应该使用 prop 而不是 attr

    $('#ownplace').prop('checked', true );

    属性 仅适用于 jQuery 1.6 或之前

        4
  •  0
  •   PeterKA    10 年前

    很可能是因为 if 条件使用:

    !$('#ownplace').is(':checked')   //instead of $('#ownplace').not(':checked')
    

    然后使用以下选项选中复选框:

    $('#ownplace').prop('checked', true );
    
        5
  •  0
  •   Kumar Nitesh    10 年前

    似乎是.ui的queryselector。切换可能会导致一些问题。这是JSFiddle,您可以在其中看到for.ui切换代码,但对于.ui,代码工作正常。切换它不会。

    https://jsfiddle.net/krnitesh/uovoykya/

    <button class="ui.toggle" >Click Me</button>
    <input type="checkbox" id="ownplace" checked="true" />
    
    <button class="ui-toggle" >Click Me</button>
    <input type="checkbox" id="ownplace2" checked="true" />
    $('.ui.toggle' ).on("click", function() {
    console.log(($('#ownplace').is(':checked')));
    
    $('#ownplace').prop("checked", !($('#ownplace').is(':checked')));
    
    });
    
    $('.ui-toggle' ).on("click", function() {
    console.log(($('#ownplace2').is(':checked')));
    
    $('#ownplace2').prop("checked", !($('#ownplace2').is(':checked')));
    
    });