Home > Web Front-end > JS Tutorial > jQuery page refresh (partial, all) problem analysis_jquery

jQuery page refresh (partial, all) problem analysis_jquery

WBOY
Release: 2016-05-16 15:20:54
Original
1383 people have browsed it

The example of this article is divided into two parts to introduce the jquery refresh problem. The first part introduces the partial refresh of the page; the second part introduces the full refresh of the page
First: Partial page refresh

jQuery encapsulates Ajax operations. In jQuery, the $.ajax() method is the lowest-level method. The second layer is the laod(), $.get() and $.post() methods, and the third layer is Are the $.getScript() and $.getJSON() methods.
Focus on analysis The load() method is usually used to obtain static data files from the Web server. To pass some parameters to the page in the server, you can use the $.get() or $.post() method $.ajax method

load() Code 
//无参数传递,则是GET方式
$("#resText").load("test.php",function(){
//......
});

//有参数传递,则是POST方式
$("#resText").load("test.php",{name:"xht555",age:"24"},function(){
//......
});

Copy after login

Let’s briefly talk about the difference between post and get:

get: Use the get method to transmit simple data (that is, the browser appends each form field element and its data to the end of the url according to the format of the URL parameters), but the size is generally limited to 1KB; cached by the client's browser Get up, it's not safe.

post: The browser sends each form field element and its data to the web server as the entity content of the HTTP message, instead of passing it as parameters of the URL address.

Summary:

1: The GET method transmits a small amount of data, has high processing efficiency and low security, and will be cached, while the opposite is true for POST.

2: AJAX garbled problem
Reasons for garbled characters:
1. The default character encoding of the data returned by xtmlhttp is utf-8. If the client page is gb2312 or other encoded data, garbled characters will be generated
2. The default character encoding for data submitted by the post method is utf-8. If the server-side encoding is gb2312 or other encoding data, garbled characters will be generated

The solutions are:
1. If the client uses gb2312 encoding, specify the output stream encoding on the server

2. Both the server and the client use utf-8 encoding

gb2312:header('Content-Type:text/html;charset=GB2312');

utf8:header('Content-Type:text/html;charset=utf-8');

Note: If you have followed the above method and still return garbled characters, check whether your method is get. For get requests (or anything involving url passing parameters), the passed parameters must first be passed encodeURIComponent method processing. If encodeURIComponent is not used, garbled characters will also be generated

$.post() Code 

//$.post()方式:
$('#test_post').click(function (){
  $.post(
   'ajax_json.php',
   {
    username:$('#input1').val(),
    age:$('#input2').val(),
    sex:$('#input3').val(),
    job:$('#input4').val()
   },
   function (data) //回传函数
   {
    var myjson='';
    eval('myjson=' + data + ';');
    $('#result').html("姓名:" + myjson.username + "<br/>工作:" + myjson['job']);
   }
  );
  });



$.get() Code 
//$.get()方式:
$('#test_get').click(function ()
{
  $.get(
   'ajax_json.php',
   {
    username:$("#input1").val(),
    age:$("#input2").val(),
    sex:$("#input3").val(),
    job:$("#input4").val()
   },
   function(data) //回传函数
   {
    var myjson='';
    eval("myjson=" + data + ";");
     $('#result').html("姓名:" + myjson.username + "<br/>工作:" + myjson['job']);
   }
  );
});


});

$.getJson(”Default.php”, {id:”1″, page: “2″ },
function(data){
//注意,这里返回的JSON数据格式,不同于xml.
});


Copy after login

Second: Refresh all pages

  • 1 window.location.reload() refreshes the current page.
  • 2 parent.location.reload() refreshes the parent object (for framework)
  • 3 opener.location.reload() refreshes the parent window object (for single-open windows)
  • 4 top.location.reload() refreshes the top object (for multiple windows)

The above is the detailed content of this article, I hope it will be helpful to everyone’s study.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template