form表单input使用disabled后提交不能获取表单值的解决方法

今天遇到一个问题：在form表单中的input上使用disabled禁用标致，会导致表单提交时获取不到值。经过调试，以及参考相关博文，最终得以解决，下面记录解决方法。

form表单输入框input设置disable属性提交后，得不到该输入框的值，解决该类问题可以参考下面两个方法：

方法一：使用readonly带替代disabled，即把 disabled="disabled" 修改为 readonly="readonly"

方法二：使用一个type=hidden隐藏要获取值的input，再使用disabled显示给用户看的input

<input type="hidden" name="url" value="https://www.baidu.com"/>
<input type="text" value="https://www.baidu.com" disabled="disabled"/>

二者区别：

disabled不能接收焦点，使用tab键时将被跳过，可能不是successful的；
readonly可以接收焦点但不能被修改，可以使用tab键进行导航，可能是successful的。
注：只有successful的表单元素才是有效数据，即是进行提交后可以获取值。disabled和readonly的文本输入框只能通过脚本进行修改value属性。

form表单input使用disabled后提交不能获取表单值的解决方法相关推荐

表单input中disabled提交后得不到值的解决办法
转载自:http://blog.csdn.net/u014185140/article/details/51985147 input的字段当为diabled时时无法获取数值得,所以最近不要用这个,我们 ...
Vue form表单input框手动赋值提交时表单input值没有生效验证仍然是空
一.问题 1.input 赋值后表单提交却为空在调用接口将返回的值赋在表单的 input 上或者子页面传递数值给父页面form表单model元素后,提交表单,明明值已经赋上去了,结果提交后显示的该值 ...
html input禁止驶入,layui form表单 input输入框获取焦点后阻止Enter回车自动提交 – 执念 – 博客园...
最简单的解决办法,不影响其他操作,给提交按钮增加 type="button" 属性完美解决立即提交 layui表格编辑状态下回车进入下一单元格 $(document).keyu ...
14款CSS3炫酷表单input输入框美化效果【附源码】
这是一款效果非常酷的CSS3表单input输入框美化效果插件.为表单的input输入框制作一些特殊的效果能给用户带来更好的用户体验.这个CSS3表单input输入框美化插件就是一个很好的例子.这个插件 ...
HTML form表单添加enctype属性后获取不到input值
HTML form表单添加enctype属性后获取不到input值问题如图所示, 在servlet中输出获取的属性值,发现全部为null 最后结论 enctype修改了form表单提交时的格式,不再 ...
form表单按enter键自动提交的问题
废话不多说.直接上代码. 1:form表单按enter键自动提交的情况 1 <!doctype html> 2 <html lang="en"> 3 < ...
ExtJs 备忘录（4）—— Form表单（四） [ 数据提交 ]
一.截图和示例共用Ext.FormPanel 1.1 截图由于本文主要关注的是表单提交的几种方式,所以仅用了一个表单项以便于测试和减少示例代码. 1.2 示例共用Ext.FormPanel ...
form提交php怎么接收不到,php form表单post提交获取不到数据，而使用get提交能获取到数据的解决办法...
开发环境:xampp,mac,phpstorm 其实出现这个问题的原因就是在于phpstorm,它默认使用的是自带的内部服务器,这个服务器使用63342端口,而且服务器内部有问题,导致POST方法异常 ...
HTML form表单 input输入框
记录: form标签的作用是在页面引入一个表单,该表单可以直接将数据提交给服务器.action属性用来设置提交的服务器地址描述: input输入框.通过type属性可以设置不同类型的输入框. 解决方 ...

form表单input使用disabled后提交不能获取表单值的解决方法

form表单input使用disabled后提交不能获取表单值的解决方法相关推荐

最新文章

热门文章