javascript - 为什么这个 img 元素没有被 javascript 改变？

Question

我正在尝试根据ajax请求的结果更改img标签的src属性。此请求返回一个 json 并且一切正常，我的 if 测试到达了代码的正确部分，它在浏览器控制台显示了预期的输出，但 src 属性没有被更改。

我已经尝试使用以下方法删除此 img 元素:

$('#l'+generatedId).remove(); 

然后通过执行以下操作在父元素内创建一个新元素:

$('#msgid'+generatedId).append('<img id="l'+generatedId+'" src="newpath" />');

但我没有成功，什么也没有发生。

“完整”代码:

var generatedId=0;

function doSomething(){

$('#msg').append('<p class="msg2" id="msgid'+generatedId+'" data-sid="msgid'+generatedId+'">'+$('#msgtxt').val()+'<img id="l'+generatedId+'" src="url/load.svg" /></p>');

$.ajax({
    data: $('#enviaChat').serialize(),
    url: 'assets/lib/msg.php',
    type: 'POST',
    cache: false,
    success:function(data){
        var msgReturn = JSON.parse(data);
        console.log(data);
        if(msgReturn.status=='ok'){
        $('#l'+generatedId).attr('src','url/ok.png');
            }
          }
});
generatedId++;
}

我还想更改相应 img 标签的“data-sid”属性json返回的ID msgid值但目前它也没有改变，我认为这是同样的问题。

正如我所说，浏览器控制台窗口中的控制台输出符合预期:

{"status":"ok","msgid":"8"}

--编辑1:

伙计们，我在 if“ok”条件中添加了一些代码

console.log('Before:'+$('#l'+generatedId).attr('src'));
$('#l'+msgnova).attr('src','url/msgok.png');
console.log('After:'+$('#l'+generatedId).attr('src'));


The result is First: undefined / After: undefined. So I guess the element is not being found. So the conlusio is the element is not in the DOM. Does anyone had this problem? I also tried to create the <p> parent first and then append the <img> but it doesn't work also.

Answer 1

我认为这是一个范围问题，由于某种原因，成功 block 无法使用 jquery 选择器“查看”元素。解决方案是创建一个变量并为其赋予元素属性:

var generatedId=0;

function doSomething(){

$('#msg').append('<p class="msg2" id="msgid'+generatedId+'" data-sid="msgid'+generatedId+'">'+$('#msgtxt').val()+'<img id="l'+generatedId+'" src="url/load.svg" /></p>');
**var createdElem = $('#l'+generatedId);**
$.ajax({
    data: $('#enviaChat').serialize(),
    url: 'assets/lib/msg.php',
    type: 'POST',
    cache: false,
    success:function(data){
        var msgReturn = JSON.parse(data);
        console.log(data);
        if(msgReturn.status=='ok'){

        //line below was altered
        createdElem.attr('src','url/ok.png');
        //instead of $('#l'+generatedId).attr('src','url/ok.png');

            }
          }
});
generatedId++;
}