javascript - jQuery 基于对象的查找和复选框

标签 javascript jquery

我有一个由 PHP 生成并呈现到页面以供 jQuery 使用的对象。该对象可以包含多个记录/值。该对象包含一个ID号和一个employeeID。

[

  {

  "intID": "202",

  "text": "Dav123"

 }


]

我尝试根据对象中的数据检查页面上的复选框。以下是复选框的示例:

<input type="checkbox" value="Dav123" intid="202" class="projectMember">

我试图循环遍历该对象并选中 intIDempID 与页面上的复选框匹配的所有框。

我尝试做这样的事情,但它不会检查任何东西。

jQuery.each(preload_presenters, function(i, val) {
  var intID = val.intID,
      empID = val.text;

      $('.projectMember').each(function(){
            if($(this).attr('intid') == intID && $(this).val() == empID) {
                $(this).prop('checked', true);  
            } 
      })
});

有什么更干净/实用的方法来实现这一点的想法吗?

最佳答案

首先,intid 不是复选框的标准属性,并且会使页面无效,这意味着您可能会得到一些奇怪的 UI/JS 行为。如果可以,请将其更改为使用 data-* 属性:

<input type="checkbox" value="Dav123" data-intid="202" class="projectMember">

然后在你的 JS 中,你可以使用过滤器通过你拥有的属性来查找特定元素:

jQuery.each(preload_presenters, function(i, val) {
    $('.projectMember').filter(function(){
        return this.value == val.text && $(this).data('intid') == val.intID;
    }).prop('checked', true);
});

Example fiddle

关于javascript - jQuery 基于对象的查找和复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28051316/

相关文章:

javascript - 使用完全限定的 URL 在 Sizzle 中选择元素的方法

javascript - 为什么我的新闻通讯表单在 Amazon CloudFront 上不起作用?

javascript - 当高度低于某个数字时隐藏 DIV 的正确逻辑是什么?

javascript - 将图像裁剪到所需的长宽比,然后调整大小

javascript - 加载新数据时更新上下文行 d3

javascript - 如何使用node.js比较两个json数组

javascript - 从一个模型获取图层并将其分配给另一个模型

jquery - Bootstrap Collapse 在动态创建元素后不起作用

javascript - 循环setTimeout

java - 如何使用Ajax进行jquery表单提交?