我在ul中有一个li
,如下所示。
<li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window">Navigate Window</li>
我尝试使用以下代码更改此
li
的文本。$('#list1 #' + selectedId).text('abcd');
使用此代码,文本可以很好地更改。但是它丢失了
input
内部的li
。如何防止替换整个li
?我也在stackoverflow中尝试了以下内容。
change just text in li that contains img
我尝试了如下
$("ul.list-group > li.list-group-item > span.thetext").html('abcd');
我的
ul
类是list-group
。但是我失败了。怎么办呢?提前致谢!
最佳答案
最简单的解决方案是将文本包装在span
中,然后使用类似选择器的方式更改跨度的内容
var selectedId = '1909';
$('#list1 #' + selectedId + ' span').text('abcd');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="list1">
<li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window"><span>Navigate Window</span></li>
</ul>
如果这不可能,则根据您的标记,您需要更改
li
的最后一个子项的内容,以便var selectedId = '1909';
$('#list1 #' + selectedId).contents().last().text('abcd');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="list1">
<li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window"><span>Navigate Window</span></li>
</ul>