【www.bbyears.com--页面特效】
问题分析
先是容器，一开始是隐藏的。
<script>
$(document).ready(function() {
$("add_div").hide();
});
</script>
这个div是空的，用于将$.load()的内容放入其中。
当我们点击“查看”按钮后，执行如下js：
代码如下function edit(){
$("#add_div").css("display","");
//清空，并将数据放入
$("#add_div").html("");
$("#add_div").load("?",{
act:"list"
});
}
返回的内容是:
代码如下记录（24）
×
而我如下代码:
代码如下$(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){
}
});
}
}