html神坑之button的type属性

1，入坑记录

不知道第几次入坑这个button的type属性了，今天我要记录一下，告诫一下自己。经常你回发现正确的jquery语句，但是点击事件却没有反应，如果你不调试，你可能发现不了问题，其实效果已经出来了，但是页面刷新了，导致跟没效果一样。

2，代码演示(错误)

<html>
<head>
<title>Insert title here</title>
<script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">$(function(){$("#add").click(function(){$("#add").attr('disabled',true);$("#add").text('已发送');$("#br").before("验证码: <input type='text' name='checkcode'/>");});});
</script>
</head>
<body><form action="#" method="post">手机号: <input type="text" name="phone"><button id="add"> 发送验证码</button><br><br id="br"></form>
</body>
</html>

####3，代码演示(正确)

<html>
<head>
<title>Insert title here</title>
<script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.min.js"></script>
<script type="text/javascript">$(function(){$("#add").click(function(){$("#add").attr('disabled',true);$("#add").text('已发送');$("#br").before("验证码: <input type='text' name='checkcode'/>");});});
</script>
</head>
<body><form action="#" method="post">手机号: <input type="text" name="phone"><button type="button" id="add"> 发送验证码</button><br><br id="br"></form>
</body>
</html>

总结：button标签的type属性在IE浏览器默认是button，但在其他浏览器默认是submit，所以写button的时候最好都指定其type属性，不要省事，不然入坑很难找到原因的。

html神坑之button的type属性相关推荐

button type属性
button type属性 submit 该按钮是提交按钮(除了 Internet Explorer,该值是其他浏览器的默认值) button 该按钮是可点击的按钮(Internet Explorer ...
button标签的type属性
button的type属性: IE:默认type="button" 除IE以外的浏览器:默认type="submit" <button>编辑< ...
IE6-IE9兼容性问题列表及解决办法_补遗漏之一：button的type默认值改变为submit了。...
经过一段时间的实践,在"IE6-IE9兼容性问题列表及解决办法总结"的基础上,再补充1点: http://www.cnblogs.com/liuzhendong/archive/2 ...
button标签定义type属性
开发时候遇到一个很头大的问题,每次点button,不会走onclick定义的方法,而是走提交onsubmit的方法. <form action="跳转到页面2" οnsubm ...
button标签的属性:type=button
<button>标签是定义一个按钮. 问题分析:写好一个按钮之后,进行点击测试,发现页面会自动刷新. 问题原因:按钮规定type属性:Internet Explorer 的默认类型是&qu ...
关于button中的type属性来决定是否提交form表单
button中的type属性:submit和button.(1)其中IE浏览器默认的是button,非IE默认的是submit:(2)button不提交整个form表单,而submit提交整个form ...
使用Html中button标签的type属性默认值
今天在使用button按钮绑定实现Ajax异步获取数据时,总会在浏览器地址栏显示一些刚用Ajax提交的参数,话不多数,直接上图这是前端的页面展示前端代码展示: Ajax代码当我们点击修改后,浏览 ...
php 按钮的属性值,HTML button标签的属性有哪些
HTML button的属性有:autofocus.disabled.form.formaction.formenctype.formmethod.formnovalidate.formtarget. ...
html密码字段语法,HTML input 标签的 type 属性
HTML 标签的 type 属性定义和用法 type 属性规定 input 元素的类型. 实例下面的表单拥有两个输入字段以及一个提交按钮: First name: Last name: 亲自试一试 ...

html神坑之button的type属性

1，入坑记录

2，代码演示(错误)

####3，代码演示(正确)

总结：button标签的type属性在IE浏览器默认是button，但在其他浏览器默认是submit，所以写button的时候最好都指定其type属性，不要省事，不然入坑很难找到原因的。

html神坑之button的type属性相关推荐

最新文章

热门文章