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. Sqlserver调用api

    虽然使用sqlserver去调用服务接口的情况比较少,但也可以去了解下对应的使用情况 一.首先要开启组件的配置 sp_configure ; GO RECONFIGURE; GO sp_configu ...

  2. 【Java EE 学习 67 下】【OA项目练习】【SSH整合JBPM工作流】【JBPM项目实战】

    一.SSH整合JBPM JBPM基础见http://www.cnblogs.com/kuangdaoyizhimei/p/4981551.html 现在将要实现SSH和JBPM的整合. 1.添加jar ...

  3. 如何解决Selenium中"Cannot find function addEventListener in object [object HTMLDocument]"的错误

    project: blog target: how-to-resolve-cannot-find-function-addEventListener-error-in-selenium.md stat ...

  4. Python的闭包

    Python的闭包 闭包概念都是一样的,实现机制一样,看看下面的代码是不是和javascript很像 def generate_counter(): cnt = [0] def count_one() ...

  5. Atitit.提升电子商务安全性 在线充值功能安全方面的设计

    Atitit.提升电子商务安全性 在线充值功能安全方面的设计 1. 防止dataservcie对充值订单表的直接改写,只能通过api,不能通过sql1 1.1. Order_id的安全取值,注入检测1 ...

  6. React Native 开发之 (07) 常用组件-View

    掌握了React Native的组件就可以使用IOS的原生组件和API. 一 View组件 就像开发web应用程序中,需要使用很多的HTML标签.例如 div,form.但是在基于DIV+CSS布局的 ...

  7. Effective Java 20 Prefer class hierarchies to tagged classes

    Disadvantage of tagged classes 1. Verbose (each instance has unnecessary irrelevant fields). 2. Erro ...

  8. AC自动机 &amp; Fail树 专题练习

    Fail树就是AC自动机建出来的Fail指针构成的树. [bzoj3172][xsy1713]单词 题意 给定一些单词,求每个单词在所有单词里面的出现次数. 分析 构建Fail树,记录每个单词最后一个 ...

  9. [vim]vim中有中文乱码

    sudo gedit /etc/vim/vimrc 在文件的最后加上 let &termencoding=&encoding set fileencodings=utf-8,gbk,u ...

  10. 嵌入式 hi3518c下ramdisk文件系统与文件系统烧写以及uboot中change-the-env

    NULL RAM : mkdir ramdisk_test  临时挂在点 dd if=/dev/zero of=123 bs=1k count=10000 建立空硬盘 losetup /dev/loo ...