jquery中$.post()方法的简单实例


Posted in Javascript onFebruary 04, 2014

在jqery中有这样一个方法,$.post()下面就这个方法做一个简单的实例:

jQuery.post( url, [data], [callback], [type] ) :
使用POST方式来进行异步请求

参数:

url (String) : 发送请求的URL地址.

data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。

callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。

type (String) : (可选)官方的说明是:Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)

1.html页面(index.html)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Untitled Document</title>
<script type="text/javascript" src=\'#\'" /jquery-1.3.2.js"></script>
<script language="javascript">
function checkemail(){  if($('#email').val() == ""){
    $('#msg').html("please enter the email!");
    $('#email').focus;
    return false;
  }
  if($('#address').val() == ""){
    $('#msg').html("please enter the address!");
    $('#address').focus;
    return false;
  }
  ajax_post();
}

function ajax_post(){
  $.post("action.php",{email:$('#email').val(),address:$('#address').val()},
  function(data){
    //$('#msg').html("please enter the email!");
    //alert(data);
    $('#msg').html(data);
  },
  "text");//这里返回的类型有:json,html,xml,text
}
</script>
</head>
<body>
<form id="ajaxform" name="ajaxform" method="post" action="action.php">
    <p>
    email<input type="text" name="email" id="email"/>
    </p>
    <p>
    address<input type="text" name="address" id="address"/>
    </p>
    <p id="msg"></p>
    <p>    
        <input name="Submit" type="button" value="submit" onclick="return checkemail()"/>
    </p>
</form>
</body>
</html>

2.php页面(action.php)
<?php
$email = $_POST["email"];
$address = $_POST["address"];
//echo $email;
//echo $address;
echo "success";
?>

说明:当点击按钮时,注意按钮现在的类型是button.在不使用$.post()方法时,按钮类型是submit,这样submit提交form里的数据,采用post方法传递到页面action.php,这时在页面action.php中就能接受到传过来的数据。当采用$.post方法时,我们在函数ajax_post()方法中其实就是使用了post的方法。(要引用jquery库文件)
Javascript 相关文章推荐
jquery随意添加移除html的实现代码
Jun 21 Javascript
js利用事件的阻止冒泡实现点击空白模态框的隐藏
Jan 24 Javascript
获取当前点击按钮的id用this.id实现
Mar 17 Javascript
JS遍历Json字符串中键值对先转成JSON对象再遍历
Aug 15 Javascript
JavaScript Math.floor方法(对数值向下取整)
Jan 09 Javascript
JavaScript标准对象_动力节点Java学院整理
Jun 27 Javascript
SpringMVC简单整合Angular2的示例
Jul 31 Javascript
原生JS实现前端本地文件上传
Sep 08 Javascript
如何安装控制器JavaScript生成插件详解
Oct 21 Javascript
如何用RxJS实现Redux Form
Dec 29 Javascript
Moment.js实现多个同时倒计时
Aug 26 Javascript
layer实现弹出层自动调节位置
Sep 05 Javascript
用jQuery与JSONP轻松解决跨域访问的问题
Feb 04 #Javascript
jquery的ajax和getJson跨域获取json数据的实现方法
Feb 04 #Javascript
jquery ajax跨域解决方法(json方式)
Feb 04 #Javascript
解决json日期格式问题的3种方法
Feb 02 #Javascript
为jQuery添加Webkit的触摸的方法分享
Feb 02 #Javascript
简单的JavaScript互斥锁分享
Feb 02 #Javascript
在百度知道团队中快速审批新成员的js脚本
Feb 02 #Javascript
You might like
php auth_http类库进行身份效验
2009/03/19 PHP
php中explode与split的区别介绍
2012/10/03 PHP
2个自定义的PHP in_array 函数,解决大量数据判断in_array的效率问题
2014/04/08 PHP
PHP实现数组递归转义的方法
2014/08/28 PHP
php模板引擎技术简单实现
2016/03/15 PHP
Javascript类库的顶层对象名用户体验分析
2010/10/24 Javascript
用nodejs写的一个简单项目打包工具
2013/05/11 NodeJs
node.js中的emitter.on方法使用说明
2014/12/10 Javascript
Bootstrap实现登录校验表单(带验证码)
2016/06/23 Javascript
JS实现输入框提示文字点击时消失效果
2016/07/19 Javascript
JavaScript数组操作详解
2017/02/04 Javascript
Node.js操作redis实现添加查询功能
2017/05/25 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
2018/07/10 Javascript
Vue2 监听属性改变watch的实例代码
2018/08/27 Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
2019/09/24 Javascript
js实现整体缩放页面适配移动端
2020/03/31 Javascript
解决vue中的无限循环问题
2020/07/27 Javascript
vue 导出文件,携带请求头token操作
2020/09/10 Javascript
[42:20]Winstrike vs VGJ.S 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
python抓取最新博客内容并生成Rss
2015/05/17 Python
python下读取公私钥做加解密实例详解
2017/03/29 Python
详解Anconda环境下载python包的教程(图形界面+命令行+pycharm安装)
2019/11/11 Python
Python numpy数组转置与轴变换
2019/11/15 Python
基于python实现雪花算法过程详解
2019/11/16 Python
python清空命令行方式
2020/01/13 Python
Python打包工具PyInstaller的安装与pycharm配置支持PyInstaller详细方法
2020/02/27 Python
如何使用PyCharm将代码上传到GitHub上(图文详解)
2020/04/27 Python
常见的软件开发流程有哪些
2015/11/14 面试题
物流管理毕业生自荐信
2013/10/24 职场文书
连锁经营管理专业大学生求职信
2013/10/30 职场文书
大学毕业生通用自荐信范文
2013/10/31 职场文书
股份转让协议书
2014/04/12 职场文书
课程设计的心得体会
2014/09/03 职场文书
网吧温馨提示
2015/07/17 职场文书
Python还能这么玩之用Python修改了班花的开机密码
2021/06/04 Python
Python实现生成bmp图像的方法
2021/06/13 Python