给禁用的input标签赋值

Input标签大家都知道，是可以自己输入值的，但有些时候，需要把input标签禁用，就不能自己输入值了，还要动态的给它赋值，这个效果在做项目中也是会遇到的，项目有这个需求，我们就需要实现它。下面就来看看如何给禁用的input标签赋值。

1、话不多说，先简单把页面搭建好。代码如下图所示：

可以看到就是简单的两个input标签，如何分别给上id和默认值，其中一个给上disabled属性，就是将其禁用了。效果如下图所示：

2、下面我们就要通过一个键盘事件，来给禁用的input标签赋值。直接看代码如下图所示：

就是简单的一小段代码，就能给禁用的input标签赋值。通过键盘弹起事件keyup()，然后获取到输入值的input标签的val()，再将它赋值给禁用的input标签就可以了。

效果如下图所示：

上面这个例子是两个input标签，所以赋值的时候也就比较方便简单，但是当要一个下拉框选择的时候给input赋值就会复杂那么一些了，下面下面就来看看。

3、搭建好页面，代码如下图所示：

还是简单的搭建，一个input标签和select标签。给上各自的id。效果如下图所示：

接下来就再直接看JS代码，如何获取到select标签选项的值，再赋值给禁用的input标签。

代码如下图所示：

这次是通过select标签的值改变事件change()，来给input标签赋值，首先要获取到select的val()，再通过select的val()，来获取到选项的text()，最后就是赋值给input标签。

效果如下图所示：

这样就实现将select标签的选择赋值给禁用的input标签了，以上两个例子就是给禁用的input标签赋值，当然除了这两个例子以外肯定还有其他的，例如你也可以将上面两个例子连接起来，将input标签输入的值作为select标签的选项，然后就能通过select的标签的值改变事件，动态赋值给禁用的input标签，这就更完善了这个功能。关于input标签还有很多应用和功能，只要多去思考，都有可能实现。