Question

问候，

对jQuery的语法不熟悉，我发现自己在编写代码时有点沮丧。因此，虽然我意识到我的问题很可能是一个逻辑问题，但由于我不熟悉的语法，我仍然遇到问题。

我有一系列<li>个标签，每个标签都有<input type="checkbox">个标签。刷新页面时，复选框仍保持选中状态，但是<li>需要保持.grey类仍然保持不变，但它会丢失。以下是我目前正在尝试使用的代码来解决此问题：

$('#servemod').ready(function() {
    $('#servemod').find('li').each( function() {
    if ($('li').find('input:checkbox').attr('checked')==1) {
        /*alert($(this).find('input:checkbox'));*/
        /*alert($('li').find('input:checkbox').attr('checked'));*/
            $(this).addClass('grey');

    }
    });
});

我目前正在使用警告框告诉我jQuery当前正在查看哪个DOM部分，看起来没问题。但问题是，即使使用循环，它似乎只测试第一个<li>的检查状态。如果选中第一个，则循环通过并将所有<li>变为蓝色。如果未选中第一个，则不执行任何操作。我很肯定这是非常基本的东西，但我已经在这里待了好几个小时而且我只是没有看到它。任何帮助将不胜感激。

html部分的完整代码（删除了很多绒毛）

<div id="servemod">
   <ul>
      <li><input type="checkbox"><p>box 1</p>
      <li><input type="checkbox"><p>box 2</p>
   </ul>
</div>

灰色的css值只是颜色变为蓝色。

Answer 1

    $(document).ready(function() {
      $('#servemod ul li input:checked').each( function() {
        $(this).closest('li').addClass('grey');
      });
});

Answer 2

以下是jsfiddle http://www.jsfiddle.net/T4BKw/

中的工作代码

$('#servemod li').each(function(){
    if($(this).find(':checkbox').is(':checked')){
        $(this).addClass('grey');
    }

});

Answer 3

这是否符合您的要求？

jQuery(
  function($)
  {
    $('#servemod li :checked').closest('li').addClass('grey');
  }
);

P.S：这应该取代您发布的整个代码段。

Answer 4

它是否可能因为你没有最终输入和li标签而无法正常工作？

<li><input type="checkbox"><p>box 1</p></input></li>

Answer 5

if语句中的测试对整个文档中li元素中的每个复选框都有效：

$('li').find('input:checkbox') // returns all of the matches in the document.

此外，大多数jQuery方法操作并应用于元素集，但不适用于attr：它只对匹配元素中的第一个元素进行操作，因此if子句仅测试包含在元素中的第一个复选框。 li。

由于您只想检查相对于<li>元素（并且因为每个<li>只包含一个复选框），您可以使用$(this)：

if($(this).find('input:checkbox').attr('checked') == 1) {
    $(this).addClass('grey');
}

jQuery：检查页面（重新）加载时复选框的值

5 个答案: