Question

我有以下jQuery代码：

$('#foo').click(function ()  {
    var loading = $('<img id="loading" src="images/loader.gif" alt="loading" />');
    $('#stars').prepend(loading);
    alert('WAIT');
});

$('#bar').click(function ()  {
     $('#stars').empty();
});

首次点击#foo时，我的浏览器窗口中会显示该图片。点击#bar然后再次#foo后，图片未显示。

我使用Chrome并使用Inspect Element工具，我可以在代码中看到第二次点击img时#stars标记已在#foo中添加。但是浏览器窗口中没有显示img。

任何想法为什么？我应该使用live()函数，但是如何使用？

Answer 1

这似乎对我有用。

查看我在这里放置的演示：http://jsfiddle.net/uWfW7/1/

我现在无法在Chrome中对此进行测试，但它在FF5中对我有效。或者，每次只需显示/隐藏图像时，不必重新创建图像对象。

<强> HTML

<div id="image"><img src="[...] alt="text"></div>

<强> CSS

#image{display:none;}

<强> JS

$('#foo').click(function(){$('#image').show()})
$('#bar').click(function(){$('#image').hide()})

在这里演示：http://jsfiddle.net/t5QJg/

Answer 2

似乎工作正常，看看：http://jsfiddle.net/84Nj3/1/

您的代码中可能存在导致问题的不同内容。

jQuery img add没有显示

2 个答案: