取消选中使用 JavaScript 中的数据属性复选框

uncheck checkbox using data attributes in javascript

本文关键字：数据属性 JavaScript 复选框 取消      更新时间：2023-09-26

我在li中有一个复选框，就像

<ul id="anotherdata" class="live-search-list" style="display: block;">
<li class="list_items" data-search-term="systimehour    "><div class="row"><div class="col-xs-2 col-md-1"></div><div class="col-xs-10 col-md-11"><div class="item"><div class="item-title">SysTimeHour<span class="pull-right"><input type="checkbox" value="SysTimeHour" name="checkbox"></span></div> </div></div></div></li>
<li class="list_items" data-search-term="systimemin "><div class="row"><div class="col-xs-2 col-md-1"></div><div class="col-xs-10 col-md-11"><div class="item"><div class="item-title">SysTimeMin<span class="pull-right"><input type="checkbox" value="SysTimeMin" name="checkbox"></span></div>   </div></div></div></li>

另一方面，我有一个函数调用，我需要取消选中 "已选中"复选框

function tagremove(i)
        {
            $('.live-search-list li').each(function(){   
                var datavalue= $(this).data("search-term");
            //  alert(datavalue);
                if(datavalue==i)
                { $(this).attr("checked", false); }  }); 
        }

但这行不通。

在当前上下文中，this引用li元素，您必须找到input元素并设置其checked属性，而不是将此属性设置为 li 元素。

下面是一个示例：

$(this).find("input[type='checkbox']").removeAttr("checked");

你可以像这样编写代码（用你的HTML示例测试）：

function tagremove(i)
{
  // You can search through document by attribute name with
  // any value. So, you can pass you `i` value directrly inside selector
  $('.live-search-list [data-search-term="' + i + '"]').each(function() {
    // You can select child elements inside of this element and check it
    $(this).find('input').attr('checked', true);
    // If checkbox is checked and you want to uncheck
    $(this).find('input').attr('checked', false);
  });
}
相关文章：