Problem analysis
First the container, the first is hidden.
| The code is as follows |
Copy Code |
<SCRIPT>
$ (document). Ready (function () {
$ (' add_div '). Hide ();
});
</SCRIPT>
<div class=add_div></div> |
This div is empty and is used to put the contents of the $.load () into it.
When we click the "View" button, perform the following JS:
| The code is as follows |
Copy Code |
function edit () {
$ ("#add_div"). CSS ("Display", "");
Empty, and put the data into
$ (' #add_div '). html (');
$ ("#add_div"). Load ('? '), {
Act: "List"
});
} |
The returned contents are:
| The code is as follows |
Copy Code |
<div id=reply_list><div style= "MARGIN:2PX; Float:left; Cursor:pointer "id=24 class=replyitem> record (</DIV>)
<a style= "MARGIN:2PX; font-size:14px "id=24 class=deletereplyitem title= Delete href=" javascript:void (0) "jquery18306790571601728192=" >x </A>
<div style= "Clear:both" ></DIV>
</DIV> |
And I have the following code:
| The code is as follows |
Copy Code |
| $ (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 ("successful operation");
}
}
})
})
Displays a detailed
$ (". Replyitem"). Click (function () {
Alert (' Come in!!! ');
$.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 (' Ya minute fly butterfly! ') +data);
If you've added the content before, open the editor at this point or the last thing you edited, so empty the editor first.
ke.html (' content ', ""); Firefox has compatible bugs
KE.util.setFullHtml (' replycontent ', ');
ke.html (' content ', data);
KE.util.setFullHtml (' replycontent ', data);
}
}
})
})
}) |
At this point, when we click on "X" there is no reaction ...
There is no JS error ...
-.-# is very depressed adjusted for a long time, are still so, strange, so find Fangfang trouble ~ (I js not ~)
Then Fangfang told me that I had to "register" these methods again. and demonstrated a bit, convinced ... Worship ~ Goddess ~
So I encapsulated the method and described the following code (the emphasis is on adding a callback function):
| The code is as follows |
Copy Code |
| function edit () {
$ ("#add_div"). CSS ("Display", "");
Empty, and put the data into
$ (' #add_div '). html (');
$ ("#add_div"). Load ('? '), {
Act: "List"
},function () {
$ (". Deletereplyitem"). Click (Delreplyone); Get a detailed
$ (". Replyitem"). Click (Delreplyone); Delete a
}); 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 (' Ya minute fly butterfly! ') +data);
If you've added the content before, open the editor at this point or the last thing you edited, so empty the editor first.
ke.html (' content ', ""); Firefox has compatible bugs
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 ("successful operation");
}
}
})
} } |
These are all very fine things.
Look at one more example
| The code is as follows |
Copy Code |
| $ (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 () {
callback function, where the event required to register the loaded page
$ (". 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) {
}
});
}
} |
