I recently used jquery to write something and found that it is still very useful. This is a tutorial on jquery, and I wrote one after simulation.
Read the code.
Jquery. noconflict ();
Function sanshi_edit (ID, editclass, postpage, isnotnull)
...{
VaR savebutton = "savebutton ";
VaR cancelbutton = "cancelbutton ";
// Var isnotnull = true;
VaR idstr = '#' + ID;
// Click the event
Jquery (idstr). Click (function ()...{
VaR textarea = '<div> <textarea rows = "3" Cols = "40"> '{jquery(idstr;.html () +' </textarea> ';
VaR button = '<div> <input type = "button" value = "save" class = "' + savebutton + '"/> <input type = "button" value =" cancel "class =" '+ cancelbutton +' "/> </div> ';
VaR revert = jquery(idstr).html ();
Jquery (idstr). After (textarea + button). Remove ();
// Click the Save button to listen to the event
Jquery ('.' + savebutton). Click (function ()...{
// Save the event
VaR postcontent = jquery (this). Parent (). siblings (0). Val ();
If (! Isnotnull & postcontent = "")
...{
Alert ("the content you entered cannot be blank ");
Return false;
} Else ...{
Sanshi_edit_save (true, jquery (this), postcontent, ID, editclass, postpage, isnotnull );
}
});
// Click the event button to cancel the listener.
Jquery ('.' + cancelbutton). Click (function ()...{
// Cancel the event
Sanshi_edit_save (false, jquery (this), revert, ID, editclass, postpage, isnotnull );
});
});
// Listen to mouse events
Jquery (idstr). Mouseover (function ()...{
Jquery (idstr). addclass (editclass );
});
Jquery (idstr). mouseout (function ()...{
Jquery (idstr). removeclass (editclass );
});
// Sanshi_edit (idstr, editclass );
// Save the modified information
Function sanshi_edit_save (issave, OBJ, text, ID, editclass, postpage, isnotnull)
...{
If (issave)
...{
// If the submit page is set, submit
If (postpage)
...{
// Debug 2008-2-1 debugging
// $. Post (postpage, {contents: text}, function (text) {$ ("# debug" ).html (text );});
Jquery. Post (postpage,... {contents: text });
}
Alert ("saved successfully ");
}
OBJ. parent (). parent (). after ('<Div id = "' + ID + '">' + TEXT + '</div> '). remove ();
Sanshi_edit (ID, editclass, postpage, isnotnull );
}
}
Easy to use
<SCRIPT>...
Jquery ("document"). Ready (function ()...{
New sanshi_edit ("sanshiedit1", "editable", "my_edit.php ");
});
</SCRIPT>
<Div id = "sanshiedit1">
Edit me
</Div>
Let's talk about the parameters.
Sanshi_edit ("sanshiedit1", "editable", "my_edit.php ");
The first parameter is the content of the DIV to be edited.
The second parameter is the style for editing the area mouse
The third parameter is submitted to that page.
Note that the submission method is post and the submitted variable is named contents.
Background Receiver
$ Text = strip_tags ($ _ post ["contents"]);
Jquery-like Google drop-down form plug-in
Http://phpitem.com/search.php view results
Author sanshi0815
Mail sanshi0815@tom.com
Blog: http://blog.csdn.net/sanshi0815
