我有一个小图标,点击后我想更改为另一个小图标,并将一个数字发布到另一个页面(但忽略新页面的HTML)。目的是让用户“喜欢”产品。我无法让它工作,没有任何事情发生。
我正在使用的代码是:
<script type="text/javascript">
$(function() {
$('.addlib').live("click",function() {
var pibn = $(this).attr("id");
$.ajax({
type: "POST",
url: "/addlibrary.php",
data: "pibn="+pibn,
beforeSend: function() {
$('a.addlib').html('<img src="/images/icons/tick.png" width="18" height="18" class="iconbutton" />');
},
success: function(html) {
return false;
}
});
return false;
});
});
</script>
并在身体中:
<span id="1000915326" class="addlib"><a href="#"><img src="/images/icons/info.png" width="18" height="18" class="iconbutton" /></a></span>
有什么想法吗?
答案 0 :(得分:1)
beforeSend: function() {
$('a.addlib').html('<img src="/images/icons/tick.png" width="18" height="18" class="iconbutton" />');
}
将其替换为
beforeSend: function() {
$('span.addlib a').html('<img src="/images/icons/tick.png" width="18" height="18" class="iconbutton" />');
}
因为a.addLib
不存在。
完成经过测试的代码。
$(function()
{
$('.addlib').live("click",function()
{
var pibn = $(this).attr("id");
var clickedDom = $(this);
$.ajax(
{
type: "POST",
url: "/addlibrary.php",
data: "pibn="+pibn,
beforeSend: function()
{
clickedDom.find('a').html('<img src="/images/icons/tick.png" width="18" height="18" class="iconbutton" />');
},
success: function(html)
{
return false;
}
});
return false;
});
});
答案 1 :(得分:0)
更简单的解决方案
$(document).on('click', '.addlib', function() {
var span = $(this),
img = span.find('img');
$.post('/addlibrary.php', {
pibn: span.attr('id')
}, function() {
img.attr('src', img.attr('src').replace('info', 'tick'))
.parent('a').unwrap();
});
});