按钮类型:button与submit区别

来源:互联网 发布:mac做流程图的软件 编辑:程序博客网 时间:2024/05/29 19:06

       web设计中,<input type="button" value="提交"/>与<input type="submit" value="提交"/>这两种按钮功能很容易让人搞混!
        submit类型的按钮用来提交表单;

        input类型的按钮一般都有onclick属性来执行脚本
        很多人问,到底这两个类型谁可以替代谁!其实这两个类型的按钮在web设计中,各有所长!
submit类型的按钮支持enter键,这是为什么很多网站在输入完用户名和密码之后,可以直接按enter键进行登录!
button的功能不是这样!比如有如下脚本:

   function beforeSubmit(){if(condition){$('div').css("border","solid red");return false;}    }
当我们点击提交按钮的时候
<input type="submit" value="提交" onclick="beforeSubmit();"/>

可以很遗憾的告诉你,你的脚本效果是显示不出来的!因为submit不仅执行onclick方法,同时也提交表单!提交表单的同时,页面就被刷新了。你的return false

根本没有起到阻止表单提交的作用,而如果换成下面:

<input type="button" value="提交" onclick="beforeSubmit();"/>

效果就可以出来了