問題分析
先是容器，一開始是隱藏的。
| 代碼如下 |
複製代碼 |
<SCRIPT>
$(document).ready(function() {
$('add_div').hide();
});
</SCRIPT>
<DIV class=add_div></DIV> |
這個div是空的，用於將$.load()的內容放入其中。
當我們點擊“查看”按鈕後，執行如下js：
| 代碼如下 |
複製代碼 |
function edit(){
$("#add_div").css("display","");
//清空，並將資料放入
$('#add_div').html('');
$("#add_div").load('?',{
act:"list"
});
} |
返回的內容是:
| 代碼如下 |
複製代碼 |
<DIV id=reply_list><DIV style="MARGIN: 2px; FLOAT: left; CURSOR: pointer" id=24 class=replyItem>記錄（24）</DIV>
<A style="MARGIN: 2px; FONT-SIZE: 14px" id=24 class=deletereplyitem title=刪除 href="javascript:void(0)" jQuery18306790571601728192="39">×</A>
<DIV style="CLEAR: both"></DIV>
</DIV> |
而我如下代碼:
| 代碼如下 |
複製代碼 |
$(document).ready(function() {
// for delete
$(".deletereplyitem").click(function(){
alert('delete');
$.ajax({
type:"POST",
data:"action=delete&destTable=replytable&masterId="+this.id+"&reviewId="+$("input[name=reviewId]").val(),
url:"?",
dataType:"json",
success:function(data){
if(data.num>0){
alert(data.error);
}
if(data.num==0){
alert("操作成功");
}
}
})
})
//顯示一條詳細
$(".replyItem").click(function(){
alert('進來！！');
$.ajax({
type:"POST",
data:"act=getOne&id="+this.id,
url:"?",
dataType:"json",
success:function(data){
if(data.num>0){
alert(data.error);
}
if(data.num==0){
alert('雅蠛蝶!'+data);
//如果之前添加過內容，那麼此刻開啟編輯器還是存在上次編輯的東西， 所以要先清空編輯器
//KE.html('content',""); //firefox存在相容bug
KE.util.setFullHtml('replycontent', '');
//KE.html('content',data);
KE.util.setFullHtml('replycontent', data);
}
}
})
})
}) |
此時當我們點擊 “X” 的時候是沒有任何反應的…
也沒有js錯誤…
-.-# 很是鬱悶調了半天，都還是這樣，怪了，於是找芳芳的麻煩~（我js不行~）
然後芳芳告訴我必須再“註冊”一次這些方法。並示範了一下，心服口服……膜拜~女神~
於是我將方法封裝了一下，形容了如下代碼(重點是加了回呼函數)：
| 代碼如下 |
複製代碼 |
function edit(){
$("#add_div").css("display","");
//清空，並將資料放入
$('#add_div').html('');
$("#add_div").load('?',{
act:"list"
},function(){
$(".deletereplyitem").click(delReplyOne); //擷取一條詳細
$(".replyItem").click(delReplyOne); //刪除一條
}); function getReplyDetail(){
$.ajax({
type:"POST",
data:"act=getOne&id="+this.id,
url:"?",
dataType:"json",
success:function(data){
if(data.num>0){
alert(data.error);
}
if(data.num==0){
alert('雅蠛蝶!'+data);
//如果之前添加過內容，那麼此刻開啟編輯器還是存在上次編輯的東西， 所以要先清空編輯器
//KE.html('content',""); //firefox存在相容bug
KE.util.setFullHtml('replycontent', '');
//KE.html('content',data);
KE.util.setFullHtml('replycontent', data);
}
}
})
} function delReplyOne(){
$.ajax({
type:"POST",
data:"action=delete&destTable=replytable&masterId="+this.id+"&reviewId="+$("input[name=reviewId]").val(),
url:"?",
dataType:"json",
success:function(data){
if(data.num>0){
alert(data.error);
}
if(data.num==0){
alert("操作成功");
}
}
})
} } |
這些都是比較細的東西
再看一個執行個體
| 代碼如下 |
複製代碼 |
$(document).ready(function() {
$('content_div').hide(); $('#list_user').click(function(event){
event.preventDefault();
load_user();
});
}); function load_user(){
//load page
$("#content_div").load('your page url',function(){
//回呼函數，在這裡註冊被載入頁面需要的事件
$(".deleteItem").click(delItem);
$(".editItem").click(editItem);
}); function delItem(){
$.ajax({
type:"POST",
url:"your url",
dataType:"json",
success:function(data){
}
});
} function editItem(){
$.ajax({
type:"POST",
url:"you url",
dataType:"json",
success:function(data){
}
});
}
} |
