1.form 中type 为submit 和button的区别

submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了。
如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成button,即取消其自动提交的行为,否则,将会造成提交两次的效果,对于动态网页来说,也就是对数据库操作两次。或者在使用submit时验证时加return true或false。
 
submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上,submit会提交表单,button不会提交表单.
两者主要区别在于:
submit默认为form提交,可以提交表单(form).
button则响应用户自定义的事件,如果不指定onclick等事件处理函数,它是不做任何事情.当然,button也可以完成表单提交的工作.
INPUT   type=submit 即发送表单,按回车提交表单   
INPUT   type=button 就是单纯的按钮功能,提交的是innerTEXT
 
 
2.本人所做的一个小实例

<form id="search-form" >
             <input type="text" name="keyword" placeholder="搜索明星名称"/>
             <input type="hidden" name="category" value="明星"/>
             <button type="button" onclick="changeKeyword(this);">搜索</button>
             </form> 

在按下这个按钮的时候并不想它直接提交,而是去执行一个函数。就可以这样写,把type改成button就会去执行函数.

这时候又遇到了另外一个问题,我想得到keyword里面输入的关键字该怎么办,解决方法。

function changeKeyword(elem){
        var $form = $(elem).parents("form");
        console.log($form.serialize());
    }

这个就会把整个form里面的值都打印出来。

如果要得到单个的值,也可以这样

function changeKeyword(elem){
         var val = $("input[name=keyword]").val();
        console.log(val);
    }

这样就可以得到keyword的值

关于button和form提交的一些问题的更多相关文章

  1. AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)

    一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...

  2. jquery.validate+jquery.form提交的三种方式

    原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...

  3. 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象

    之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...

  4. struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)

    我的前台页是这样的: <body>      <form action="test.action" method="post">     ...

  5. jquery.form.js实现将form提交转为ajax方式提交的使用方法

    本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完 ...

  6. Extjs ajax form 提交

    1.form 提交 form.form.submit({ url: "/HandlerExcelToDB/UploadFile.ashx", params: {}, success ...

  7. 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  8. HttpWebRequest结合HtmlAgilityPack实现网页form提交

    年前一个项目,需要在某个系统实现系统自动操作. 系统页面使用form提交,页面参数较多,也参数设计一系列计算逻辑,改动一个值,其他值自动改变. 传统方法使用正则表达式匹配参数,构建post参数进行请求 ...

  9. spring MVC做form提交Neither BindingResult nor plain target object for bean name &#39;command&#39; available

    这两天在做spring3.0 MVC+hibernate3.2的练习中,做简单的form提交, 一直报java.lang.IllegalStateException: Neither BindingR ...

随机推荐

  1. 2DToolkit官方文档中文版打地鼠教程(二):设置摄像机

    这是2DToolkit官方文档中 Whack a Mole 打地鼠教程的译文,为了减少文中过多重复操作的翻译,以及一些无必要的句子,这里我假设你有Unity的基础知识(例如了解如何新建Sprite等) ...

  2. nova instance出错:&quot;message&quot;: &quot;Proxy error: 502 Read from server failed

    执行 $ nova resize instance1 时候出错: {, "details": " File \"/opt/stack/nova/nova/com ...

  3. (转发)centos,redhat 系统为php安装memcached扩展

    转自:http://www.itnose.net/detail/6111623.html 1. 通过yum安装 yum -y install memcached #安装完成后执行: memcached ...

  4. 初学AOP

    src\dayday\Count.java package dayday;import org.springframework.stereotype.Component;/** * Created b ...

  5. request,session,application

    JSP 的3个内置对象request,session,application,其实都有一个作用域,这些对象内部有一个Map成员用于存放数据,比如session对象的setAttribute(key,v ...

  6. Android Fragment初探:静态Fragment组成Activity

    一直习惯了在Activity中写所有事件处理代码,直到认真学习Fragment时,才发现,Activity完全可以由多个Fragment组成. 对Fragment的了解还不够深入,先从静态Fragme ...

  7. JavaScript写一个小乌龟推箱子游戏

    推箱子游戏是老游戏了, 网上有各种各样的版本, 说下推箱子游戏的简单实现,以及我找到的一些参考视频和实例: 推箱子游戏的在线DEMO : 打开 如下是效果图: 这个拖箱子游戏做了移动端的适配, 我使用 ...

  8. Linux安装xwindow图形界面

    在我们安装Linux系统时,刚开始的时候可能没有安装图形界面的需要,但在使用过程中却有可能产生这种需求.那么这种情况下,我们需不需要重新安装Linux系统来安装桌面呢?答案是不需要.下面我将交大家在已 ...

  9. HDOJ 1907 John

    对于任意一个 Anti-SG 游戏,如果我们规定当局面中所有的单一游戏的 SG 值为 0 时,游戏结束,则先手必胜当且仅当:  (1)游戏的 SG 函数不为 0 且游戏中某个单一游戏的 SG 函数大于 ...

  10. WPF 傻瓜生成 .dbml文件,以及文件用途原理是什么