使用jQuery ajax中按钮button和submit的区别

标签: jquery ajax 按钮 | 发表时间:2012-10-06 10:08 | 作者:谈腾
出处:http://www.cnblogs.com/

昨天在使用jQuery ajax的post方法进行页面传值,无刷新获取数据展示,弄了半天就是没有效果,看了半天也没有语法错误,最后才终于明白问题出在哪里.

<script type="text/javascript">
$(document).ready(function(){
$("#submit").click(function(){
$.post("sendPwd.php",{QQnum:$("#QQnum").val(),psw:$("#psw").val()},function(data){
$("#aaa").html(data);
},"html");
});
});
</script>

jQuery ajax的post方法这样写应该是没有问题的,点击submit提交按钮,sendPwd.php通过$_POST接收传过来的值,然后echo一段数据。然而却始终无法显示传回来的值。原因在这里:

<input type="submit" name="submit" id="submit" value="提交" />

提交按钮的类型是submit,点击之后毫无反应。因为无意发现有次点击瞬间结果出来了,又变回去了,于是发现诡异,上网一查,发现大部分都把按钮设置成button类型,于是改成button之后,问题解决了。

按钮button和submit有什么区别呢?
submit主要是提交表单,是一个特殊的button,执行提交动作,button主要配合用javascript操作,本身就是一个按钮,这是根本区别。如果要使用submit,验证需要return false。本人觉得还是设置成button更加方便操作。

(小谈博客原创,作者:谈腾。转载请注明出处! http://tanteng.sinaapp.com/2012/10/button-submit/

 

 

本文链接

相关 [jquery ajax 按钮] 推荐:

使用jQuery ajax中按钮button和submit的区别

- - 博客园_首页
昨天在使用jQuery ajax的post方法进行页面传值,无刷新获取数据展示,弄了半天就是没有效果,看了半天也没有语法错误,最后才终于明白问题出在哪里.. jQuery ajax的post方法这样写应该是没有问题的,点击submit提交按钮,sendPwd.php通过$_POST接收传过来的值,然后echo一段数据.

jquery ajax 跨域请求

- - 博客园_首页
使用 jquery 中的ajax  进行跨域请求. 说明:dataType 为  "jsonp"  ;type 只能为 GET.                    //处理错误. 后台处理代码 ValidAccountsExists.aspx.

jquery的$.ajax() $.post() $.getJSON() 等ajax方法时,中文参数乱码问题

- - CSDN博客推荐文章
在使用jquery的$.ajax()  $.post() $.getJSON() 等ajax方法时,难免会有用到中文参数的问题,在后台接收的中文参数是乱码,解决方法如下:.     dataType : ‘json’     ,type : ‘POST’     ,url : ‘http://localhost/test/test.do’     ,data : {id: 1, type: ‘商品’}     ,success : function(data){             } } );.

10款实用的Ajax相关的jQuery插件推荐

- jingjing - ITeye资讯频道
本文搜集了10款最近受欢迎的、实用的AJAX jQuery插件,包括终端命令行、分页、图表、购物车插件等,你可以在你的网站或应用中使用这些插件,以达到意想不到的效果. 该插件可以在网站上实现终端交互效果. 这可不是FTP或SSH终端,你可以定义交互的命令. 该插件可以使用多种方式来解决页面分页问题,它采用一个简单而直截的Callback设计.

jQuery中利用JSONP解决AJAX跨域问题

- - 蓝飞技术博客
跨域的解决方案有多种,其中最常见的是使用同一服务器下的代理来获取远端数据,再通过ajax进行读取,而在这期间经过了两次请求过程,使得获取数据的效率大大降低,这篇文章蓝飞就为大家介绍一下解决跨域问题的一种比较通用的方案——JSONP. 简单的来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即“同源策略”.

利用jQuery和HTML5实现无刷新Ajax风格的表单

- - CSDN博客推荐文章
        利用jQuery我们能够做出一些相当震撼的网页效果. jQuery的出现使DOM的操作更加的简单易用. 下面的教程展示了如何利用jQuery创建一个HTML5效果的邀请表格,同时实现表格内容的检查功能.         首页的格式必须是HTML5的格式.         接下来添加jQuery库,将如下代码添加到标签之前:.

菜鸟简述Jquery中Ajax发送post请求及XML响应

- - 博客园_首页
在没有出现jquery前,是通过纯手工的方式获取XmlHttpRequest对象来向服务器发送异步请求实现局部刷新. 在jquery出现以后我们利用其封装好的对象来实现ajax请求,下面以post请求为例作一个简单介绍:. jQuery.post(url, [data], [callback], [type]),其中url为请求地址,data为待发送的参数及其值,callback为发送成功时的回调函数,type为返回内容的类型(xml、html、text、json等).

jQuery ajax - serialize()方法以及常见问题

- - CSDN博客推荐文章
使用ajax时,常常需要拼装input数据为'name=abc&sex=1'这种形式,用 JQuery的serialize方法可以轻松的完成这个工作. jQuery ajax - serialize() 方法定义和用法. serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身.

精心挑选的12款优秀 jQuery Ajax 分页插件和教程

- - 博客园_梦想天空
  在这篇文章中,我为大家收集了12个基于 . jQuery 框架的 Ajax 分页插件,这些插件都提供了详细的使用教程和演示. Web 项目的用户体验有了极大的提高,如今借助优秀的. jQuery 框架很容易实现各种基于 Ajax 技术实现的功能. 我们一起来看看下面这些优秀的分页插件. jPages 是一款非常不错的客户端分页插件,有很多特色,例如自动播放、按键翻页、延迟加载等等.

原生AJAX

- - Web前端 - ITeye博客
对象是ajax的基础,几乎所有的浏览器都支持他,只是创建方式不同,如IE5,IE6. 2、AJAX - 向服务器发送请求请求. 与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用. 然而,在以下情况中,请使用 POST 请求:. 无法使用缓存文件(更新服务器上的文件或数据库). 向服务器发送大量数据(POST 没有数据量限制).