读书人

新手JQUERY无刷新修改有关问题

发布时间: 2013-07-08 14:13:00 作者: rapoo

新手求助JQUERY无刷新修改问题。
后台有这样一个文章列表。


<div id="list">
<p id="1">
<a href="/uc/book_mybookshelf.aspx?id=1">文章一</a>
<a class="edit" href="javascript:void()">编辑</a>
</p>
<p id="2">
<a href="/uc/book_mybookshelf.aspx?id=2">文章二</a>
<a class="edit" href="javascript:void()">编辑</a>
</p>
<p id="3">
<a href="/uc/book_mybookshelf.aspx?id=3">文章三</a>
<a class="edit" href="javascript:void()">编辑</a>
</p>
<p id="4">
<a href="/uc/book_mybookshelf.aspx?id=4">文章四</a>
<a class="edit" href="javascript:void()">编辑</a>
</p>
<p id="5">
<a href="/uc/book_mybookshelf.aspx?id=5">文章五</a>
<a class="edit" href="javascript:void()">编辑</a>
</p>
</div>

JQUERY 代码:

$(function () {
$(".edit").click(function () {
//文章的id,要传到后台ashx中使用
var tid = $(this).parent("p").attr("id");
//显示隐藏层
$("#editform").show();
$("#editform").css("background", "green");
//取当前行的文章名
var oldname = $(this).parent("p").children("a").html();
//赋值给隐藏层的oldname
$("#oldname").html(oldname);
//隐藏层的点击事件
$("#btnEdit").click(function () {
var newname = $("#txtNewname").val();
if (newname.length <= 0) {


alert("新名称不能为空");
return false;
}
//传给后台
$.post("/uc/manage/edit_bookshelf.ashx", { id: tid, name: newname },
function (data, status) {
if (status != "success") {
alert("通信失败!");
return false;
}
if (data == "1") {
alert("修改成功");
}
else if (data == "2") {
alert("你无权修改");
return false;
}
});
});

});
});



问题现象:
先点击第一个编辑,然后在弹出框中点修改,弹出一个alert。
再点击第二个编辑,点修改,弹出二个alert.
点第三个编辑,点修改,弹出三个alert.
....
这里,后面为什么会弹出多个alert.

新手,求解。


[解决办法]
如果btnEdit不是动态生成的,那么可能是事件重复绑定了
$("#btnEdit").click(function () {});

读书人网 >JavaScript

热点推荐