jQuery页面刷新(局部、全部)问题分析


Posted in Javascript onJanuary 09, 2016

本文实例分两部分对jquery刷新问题进行介绍,第一部分介绍了呢页面局部刷新;第二部分介绍了页面全部刷新
第一:页面局部刷新

jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是laod()、$.get()和$.post()方法,第3层是$.getScript()和$.getJSON()方法。
重点分析load()方法通常用来从Web服务器上获取静态的数据文件.要传递一些参数给服务器中的页面,那么可以使用$.get()或者$.post()方法$.ajax方法

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

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

简单说一下 post 与get 区别:

get:用get方式可传送简单数据(即:浏览器将各个表单字段元素及其数据按照URL参数的格式附加在url后面),但大小一般限制在1KB下;被客户端的浏览器缓存起来,不安全。

post:览器把各表单字段元素及其数据作为HTTP消息的实体内容发送给Web服务器,而不是作为URL地址的参数进行传递,

总结:

一:GET方式传送数据量小,处理效率高,安全性低,会被缓存,而POST反之。 

二:AJAX乱码问题
产生乱码的原因:
1、xtmlhttp 返回的数据默认的字符编码是utf-8,如果客户端页面是gb2312或者其它编码数据就会产生乱码
2、post方法提交数据默认的字符编码是utf-8,如果服务器端是gb2312或其他编码数据就会产生乱码

解决办法有:
1、若客户端是gb2312编码,则在服务器指定输出流编码

2、服务器端和客户端都使用utf-8编码

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

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

注 意:如果你已经按上面的方法做了,还是返回乱码的话,检查你的方式是否为get,对于get请求(或凡涉及到url传递参数的),被传递的参数都要先经 encodeURIComponent方法处理.如果没有用encodeURIComponent处理的话,也会产生乱码 

$.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.
});

第二:页面全部刷新

  • 1 window.location.reload()刷新当前页面.
  • 2 parent.location.reload()刷新父亲对象(用于框架)
  • 3 opener.location.reload()刷新父窗口对象(用于单开窗口)
  • 4 top.location.reload()刷新最顶端对象(用于多开窗口)

以上就是本文的详细内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
学习YUI.Ext第五日--做拖放Darg&amp;Drop
Mar 10 Javascript
js调用webservice中的方法实现思路及代码
Feb 25 Javascript
js 加密压缩出现bug解决方案
Nov 25 Javascript
基于JS2Image实现圣诞树代码
Dec 24 Javascript
Vue.js一个文件对应一个组件实践
Oct 27 Javascript
JS实现类似51job上的地区选择效果示例
Nov 17 Javascript
vuejs通过filterBy、orderBy实现搜索筛选、降序排序数据
Oct 26 Javascript
Bootstrap模态框插入视频的实现代码
Jun 25 Javascript
Vue全局分页组件的实现代码
Aug 10 Javascript
跟混乱的页面弹窗说再见
Apr 11 Javascript
vue中使用vee-validator完成表单校验方案
Nov 01 Javascript
JS实现打砖块游戏
Feb 14 Javascript
javascript返回顶部的按钮实现方法
Jan 09 #Javascript
javascript类型系统 Array对象学习笔记
Jan 09 #Javascript
JS中生成随机数的用法及相关函数
Jan 09 #Javascript
JavaScript电子时钟倒计时
Jan 09 #Javascript
bootstrap-treeview自定义双击事件实现方法
Jan 09 #Javascript
WordPress中利用AJAX异步获取评论用户头像的方法
Jan 08 #Javascript
学习JavaScript设计模式之状态模式
Jan 08 #Javascript
You might like
sqlyog 中文乱码问题的设置方法
2008/10/19 PHP
解析php5配置使用pdo
2013/07/03 PHP
php连接odbc数据源并保存与查询数据的方法
2014/12/24 PHP
javascript mouseover、mouseout停止事件冒泡的解决方案
2009/04/07 Javascript
xml 封装与解析(javascript和C#中)
2009/07/26 Javascript
一个简单的jQuery插件制作 学习过程及实例
2010/04/25 Javascript
基于jquery的兼容各种浏览器的iframe自适应高度的脚本
2010/08/13 Javascript
解决3.01版的jquery.form.js中文乱码问题的解决方法
2012/03/08 Javascript
js局部刷新页面时间具体实现
2013/07/04 Javascript
javascript特殊用法示例介绍
2013/11/29 Javascript
js获取当前年月日-YYYYmmDD格式的实现代码
2016/06/01 Javascript
基于复选框demo(分享)
2017/09/27 Javascript
vue router嵌套路由在history模式下刷新无法渲染页面问题的解决方法
2018/01/25 Javascript
webpack组织模块打包Library的原理及实现
2018/03/10 Javascript
详解使用create-react-app添加css modules、sasss和antd
2018/07/31 Javascript
微信小程序和H5页面间相互跳转代码实例
2019/09/19 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
2020/02/27 Javascript
JS实现网页烟花动画效果
2020/03/10 Javascript
HTML元素拖拽功能实现的完整实例
2020/12/04 Javascript
Python Matplotlib实现三维数据的散点图绘制
2019/03/19 Python
如何安装2019Pycharm最新版本(详细教程)
2019/09/26 Python
Python对接支付宝支付自实现功能
2019/10/10 Python
python 协程 gevent原理与用法分析
2019/11/22 Python
记一次Django响应超慢的解决过程
2020/09/17 Python
JavaScript+Canvas实现自定义画板的示例代码
2019/05/13 HTML / CSS
网站性能延迟加载图像的五种技巧(小结)
2020/08/13 HTML / CSS
万代美国官网:PREMIUM BANDAI USA
2020/09/11 全球购物
实习生自我鉴定
2013/12/12 职场文书
汉语言文学职业规划
2014/02/14 职场文书
暑期社会实践感言
2014/02/25 职场文书
党员干部公开承诺书范文
2015/04/27 职场文书
2015年小学生暑假总结
2015/07/13 职场文书
你喜欢篮球吗?Python实现篮球游戏
2021/06/11 Python
Java 将PPT幻灯片转为HTML文件的实现思路
2021/06/11 Java/Android
Python中文纠错的简单实现
2021/07/07 Python
详解Python+OpenCV进行基础的图像操作
2022/02/15 Python