readonly和disabled的异同

好久木有写博客了,今来逛逛

话说今天搞form表单的时候,主管让俺把手机号设成只读的。当时我就。。。咳咳,然后我就问了下万能的百度君,果断还是有解决方法的嘛,那么,今就谈谈readonly和disabled的区别吧。

首先呢,说说不同点,因为人的第一印象是最深的,所以先说不同。

1.readonly只适用于type = text和password这两种属性的input,当然textarea自然也是可以的啦。而disabled适用于所有的表单,包括按钮。

2.在使用submit方式提交表单的时候,readonly是可以提交内容的,可以的可以的可以的,重要的事情说三遍。而disabled是不可以的,提交的时候不会提交内容。

3.readonly属性可以使用js添加onfocus事件,而disabled不可以。

然后说相同点,

1.两者都有true or false属性值,当然也都可以写成# = “#”;的形式。

2.两者都是为了保留表单预设属性值,并且不允许修改而设置的。

最后说下用法,

1.一般的话都是搭配使用,而且在使用的时候其实可以通过一些手段(js)达到相同的效果(disabled向readonly方向),所以这里推荐使用readonly属性。当然disabled也必然是有存在作用的,很多时候非用不可,也有很多时候用了能达到很好的效果。

2.关于disabled提交表单时的问题。我们写程序必然是要考虑诸多因素和情形的,在用户重复点击提交和网速较慢的情况下,我们就要做防护措施,防止重复提交造成的数据库数据冗余。而最好的方法就是在提交后对button也添加disabled属性。

好了,关于这个问题就说这么多,当然其实本人实践不足,取各家之长总而结之而已。

原文地址:https://www.cnblogs.com/yunzhexiaye/p/6133610.html