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 相关文章推荐
使用JS操作页面表格,元素的一些技巧
Feb 02 Javascript
javascript下IE与FF兼容函数收集
Sep 17 Javascript
表单JS弹出填写提示效果代码
Apr 16 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
Jun 20 Javascript
在子窗口中关闭父窗口的一句代码
Oct 21 Javascript
YUI模块开发原理详解
Nov 18 Javascript
通过JS来判断页面控件是否获取焦点
Jan 03 Javascript
jquery动态添加删除一行数据示例
Jun 12 Javascript
jQuery老黄历完整实现方法
Jan 16 Javascript
js+jquery常用知识点汇总
Mar 03 Javascript
JS实现从网页顶部掉下弹出层效果的方法
Aug 06 Javascript
基于JS实现密码框(password)中显示文字提示功能代码
May 27 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
一步一步学习PHP(3) php 函数
2010/02/15 PHP
php中根据某年第几天计算出日期年月日的代码
2011/02/24 PHP
php文档更新介绍
2011/07/22 PHP
php的闭包(Closure)匿名函数详解
2015/02/22 PHP
PHP实现163邮箱自动发送邮件
2016/03/29 PHP
利用php获得flv视频长度的实例代码
2017/10/26 PHP
屏蔽F1~F12的快捷键的js函数
2010/05/06 Javascript
Chrome中模态对话框showModalDialog返回值问题的解决方法
2010/05/25 Javascript
Node.js中AES加密和其它语言不一致问题解决办法
2014/03/10 Javascript
JS闭包、作用域链、垃圾回收、内存泄露相关知识小结
2016/05/16 Javascript
用原生js统计文本行数的简单示例
2016/08/19 Javascript
JS匿名函数实例分析
2016/11/26 Javascript
详解Jquery EasyUI tree 的异步加载(遍历指定文件夹,根据文件夹内的文件生成tree)
2017/02/11 Javascript
深入解析js轮播插件核心代码的实现过程
2017/04/14 Javascript
javascript编写简易计算器
2017/05/06 Javascript
JavaScript实现随机数生成器(去重)
2017/10/13 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
2018/01/17 Javascript
JavaScript设计模式之原型模式分析【ES5与ES6】
2018/07/26 Javascript
angular2 ng2-file-upload上传示例代码
2018/08/23 Javascript
Vue.Draggable拖拽功能的配置使用方法
2020/07/29 Javascript
详解基于Vue,Nginx的前后端不分离部署教程
2018/12/04 Javascript
react 中父组件与子组件双向绑定问题
2019/05/20 Javascript
详解vue 动态加载并注册组件且通过 render动态创建该组件
2019/05/30 Javascript
纯Python开发的nosql数据库CodernityDB介绍和使用实例
2014/10/23 Python
Python实现设置windows桌面壁纸代码分享
2015/03/28 Python
Python用zip函数同时遍历多个迭代器示例详解
2016/11/14 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
使用Python+wxpy 找出微信里把你删除的好友实例
2019/02/21 Python
python里的单引号和双引号的有什么作用
2020/06/17 Python
python 监控服务器是否有人远程登录(详细思路+代码)
2020/12/18 Python
Mistine官方海外旗舰店:泰国国民彩妆品牌
2016/12/28 全球购物
我的求职计划书
2014/01/10 职场文书
货物运输服务质量承诺书
2014/05/29 职场文书
团队拓展训练感想
2015/08/07 职场文书
Python数据清洗工具之Numpy的基本操作
2021/04/22 Python
MySQL 自动填充 create_time 和 update_time
2022/05/20 MySQL