jquery implements page local Refresh

Source: Internet
Author: User

Backstage management always use frameset to be divided into parts for management, but feel very bad use, especially the page between the switch also to Judge Window.parent, too make me bother, so learn to use XMLHttpRequest page local refresh. The code is as follows:

Java code
  1. <script type="Text/javascript" >
  2. Window.onload = function () {
  3. document.getElementById ("email"). onblur = function () {
  4. if (window. XMLHttpRequest) {
  5. Http_request = new XMLHttpRequest ();
  6. if (http_request.overridemimetype) {
  7. Http_request.overridemimetype ("Text/xml");
  8. }
  9. }Else if (window. ActiveXObject) {
  10. try{
  11. Http_request = new ActiveXObject ("msxml2.xmlhttp");
  12. }catch (e) {
  13. try{
  14. Http_request = new ActiveXObject ("Microsoft.XMLHTTP");
  15. }catch (e) {}
  16. }
  17. }
  18. if (!http_request) {
  19. Window.alert ("Cannot create XMLHttpRequest object instance!   ");
  20. return false;
  21. }
  22. Http_request.onreadystatechange = function () {
  23. if (http_request.readystate = = 4 &&
  24. Http_request.status = = ) {
  25. document.getElementById ("Emailtip"). InnerHTML
  26. =http_request.responsetext;
  27. }
  28. };
  29. Http_request.open ("GET", "email.jsp?email=" +This.value, true);
  30. Http_request.send (null);
  31. }
  32. }
  33. </script>
  34. <body>
  35. <input type="button" value="Modify" onclick="getothermessage ();"/>
  36. <input type="text" id="email"/>
  37. <span id="Emailtip" ></span>
  38. <div id="View" >
  39. 456
  40. </div>
  41. </body>

After the master reminds, you can use Ajax technology to write, using jquery is very simple, examples are as follows:

Java code
  1. <script type="Text/javascript" src="js/jquery.js" ></script>
  2. <script type="Text/javascript" >
  3. function Getothermessage () {
  4. $.ajax ({
  5. Type:"POST",
  6. URL:"${pagecontext.request.contextpath}/getothermessage.do",
  7. Success:function (msg) {
  8. $ ("#view"). HTML (msg);
  9. },
  10. Error:function () {
  11. Alert ("wrong");
  12. }
  13. });
  14. }
  15. </script>
  16. <body>
  17. <input type="button" value="Modify" onclick="getothermessage ();"/>
  18. <div id="View" >
  19. 456
  20. </div>
  21. </body>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.