仅更改包含img的li中的文本 [英] change just text in li that contains img

问题描述

我有这个html代码

<ul class="criteria">
<li id="1">
criteria 1
<img id="1" class="save_criterion" src="../images/icons/add-icon-2.png">
<img id="1" class="delete_criterion" src="../images/icons/icon_delete_16x16.png">
</li>
<li id="2">
criteria 2
<img id="2" class="save_criterion" src="../images/icons/add-icon-2.png">
<img id="2" class="delete_criterion" src="../images/icons/icon_delete_16x16.png">
</li>
</ul>

我具有动态更改li文本的功能

I have function to change li text dynamically

$("input#criterion_name").live("keyup",function(e){
    var newText =  $("input#criterion_name").val();
    if(newText){
    $("ul.criteria > li.selected").html(newText);
    }
    else{
    // can't leave the text filed empty 
    $("#criterion_name").addClass("error"); 
} 

问题是当我在输入文本中键入文本时，li元素中的图像被删除了. 我只想更改li元素中的文本

the problem is when I type text in the input text, the images in li elements removed. I want just to change the text in li element

推荐答案

您应将文本包装在其自己的元素中，例如span.然后，您可以像这样定位目标:

You should wrap the text in its own element, like a span. Then you can target that like this:

$("ul.criteria > li.selected > span.thetext").html(newText);

此外，id属性不应仅是数字，并且在文档中不应被多次使用，即，它应该是唯一的.您有几个实例，其中id="1"

Also, an id attribute should not be only numbers and should not be used more than once in a document, i.e. it should be unique. You have several instances where id="1"

这篇关于仅更改包含img的li中的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！