使用JQuery检查复选框

-1

我有这个html，我需要根据一个参数选择特定的复选框。假设我的参数是15，所以我需要找到data-id = 15，然后获取关联的复选框并以编程方式检查此复选框。我试图使用jquery，但我不是很熟悉这一点。我需要从id =“org_container_1”的div开始搜索。使用JQuery检查复选框

<div class="department-container" id="org_container_1"> 
      <div class="row department-row" data-typeid="1" data-id="14">      
       <label> 
        <input type="checkbox">      
        <span class="department-item">Org1</span> 
       </label>           
      </div> 
      <div class="row department-row" data-typeid="1" data-id="15">      
       <label> 
        <input type="checkbox">      
        <span class="department-item">Org2</span> 
       </label>           
      </div> 
      <div class="row department-row" data-typeid="1" data-id="16">      
       <label> 
        <input type="checkbox">      
        <span class="department-item">Org3</span> 
       </label>           
      </div>

来源

2015-06-24 cmonti

你有什么试过的？如果没有尝试解决您的问题，不要指望太多的帮助。 – mittmemo

使用$ .each（）jquery方法遍历每个div。 – Robin

另一种选择：

var param='15'; 
 
$('.department-container .department-row').each(function(){ 
 
    if($(this).attr('data-id')==param){ 
 
     $('input', this).attr('checked','checked'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="department-container" id="org_container_1"> 
 
    <div class="row department-row" data-typeid="1" data-id="14">      
 
       <label> 
 
        <input type="checkbox">      
 
        <span class="department-item">Org1</span> 
 
       </label>           
 
      </div> 
 
      <div class="row department-row" data-typeid="1" data-id="15">      
 
       <label> 
 
        <input type="checkbox">      
 
        <span class="department-item">Org2</span> 
 
       </label>           
 
      </div> 
 
      <div class="row department-row" data-typeid="1" data-id="16">      
 
       <label> 
 
        <input type="checkbox">      
 
        <span class="department-item">Org3</span> 
 
       </label>           
 
      </div>

来源

2015-06-24 20:30:06 depperm

谢谢。现在我有一个更好的主意。 – cmonti

，所以你要在这里用两件事情。首先是正确的jQuery选择，第二个是设置#attr('checked', true)：

$('div[data-id="' + id + '"] input[type=checkbox').attr('checked', true)

（你几乎要在过程中的一个函数来包装这个，但因为你havnt提供您的JS是什么样子，我没有任何背景您打电话的地方）

来源

2015-06-24 20:24:01 PhilVarg

您可以使用选择器通过data-id使用数据属性选择器[data-attribute-name=data-attribute-value]选择您的div。然后选中与input[type=checkbox]复选框，并使用.prop()函数进行检查。

$().ready(function() { 
 
    $('div[data-id=15] input[type=checkbox]').prop('checked', true); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="department-container" id="org_container_1"> 
 
    <div class="row department-row" data-typeid="1" data-id="14"> 
 
    <label> 
 
     <input type="checkbox"> 
 
     <span class="department-item">Org1</span> 
 
    </label> 
 
    </div> 
 
    <div class="row department-row" data-typeid="1" data-id="15"> 
 
    <label> 
 
     <input type="checkbox"> 
 
     <span class="department-item">Org2</span> 
 
    </label> 
 
    </div> 
 
    <div class="row department-row" data-typeid="1" data-id="16"> 
 
    <label> 
 
     <input type="checkbox"> 
 
     <span class="department-item">Org3</span> 
 
    </label> 
 
    </div>

来源

2015-06-24 20:24:55 Brino

试试这个：

var param = 15; 
$('[data-id="' + param + '"]').find('input').prop('checked',true);

Fiddle

来源

2015-06-24 20:26:56 Maverick976

使用JQuery检查复选框

回答

相关问题