Question

我想根据下一栏中的文字勾选复选框。这是我如何做到的，有更简洁的方式吗？

<table id="table1">
<tr><td><input type="checkbox"></td><td>Text 1</td></tr>
<tr><td><input type="checkbox"></td><td>Text 2</td></tr>
<tr><td><input type="checkbox"></td><td>Text 3</td></tr>
</table>

$(function(){
    $('input[type=checkbox]').each(function(){
    //this.checked = true;
    var strVal = $(this).closest('td').next('td').text();
    if (strVal=='Text 2')
        this.checked = true;
    //alert(strVal);
  });
});

Answer 1

使用javascript你可以用不同的方式做到这一点。我写了不同的样品请检查一下。如果您的html结构发生了变化，它会发生事件

$(function(){
	$('input[type=checkbox]').each(function(){
  	//this.checked = true;
    var strVal = $(this).attr("data-checkbox-text");
    if (strVal=='Text 1')
    	this.checked = true;
    //alert(strVal);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<table id="table1">
<tr><td><input type="checkbox"  data-checkbox-text="Text 1"></td><td>Text 1</td></tr>
<tr><td><input type="checkbox"  data-checkbox-text="Text 2"></td><td>Text 2</td></tr>
<tr><td><input type="checkbox" data-checkbox-text="Text 3"></td><td>Text 3</td></tr>
</table>

Answer 2

.filter()方法非常简洁明了：

$(function(){
    $(':checkbox').filter(function(){
  	return $(this).closest('tr').find('td').last().text() == 'Text 2';
    })
    .prop('checked',true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<table id="table1">
<tr><td><input type="checkbox"></td><td>Text 1</td></tr>
<tr><td><input type="checkbox"></td><td>Text 2</td></tr>
<tr><td><input type="checkbox"></td><td>Text 3</td></tr>
<tr><td><input type="checkbox"></td><td>Text 2</td></tr>
</table>

Answer 3

尝试这个：

$(':checkbox').filter(function(){
    return $(this).parent().next('td').text() === 'Text 2';
}).prop('checked', true);

如何根据文本选中复选框？

3 个答案: