使用Jquery如何操作输入框控件？
在做网页开发时，我们经常会引入Jquery脚本库，方便对html做各种操作。下面我们一起来看下Jquery对输入框控件能做哪些操作？
操作方法
- 01
要用Jquery进行dom操作，首先我们得要在页面引入脚本文件，如图
- 02
我们的例子里，Html代码很简单，就是一个input输入框，和几个按钮，如图
- 03
Html初始运行界面如图，
- 04
我们先为第一个按钮添加点击事件，点击后，通过Jquery设置输入框的值， 主要是通过Jquery的 val()方法来实现。 $("#txtInput").val('你需要的值'); 代码如图，
- 05
点击按钮后，我们可以看到，输入框的值已经被设置上了。
- 06
Jquery既然能设置输入框的值，当然也能读取它的值了。 这次添加第二个按钮的事件代码，如图。 这里也是用Jquery的 val()方法来读取， 当我们在这个方法里加上参数时，就是设置值，不加参数时，就是读取值。
- 07
点击第二个按钮，我们读取到了输入框的值，然后把结果显示在alert弹出框里。
- 08
接着，我们添加第三个按钮的代码，主要是通过Jquery的 prop方法来设置输入框的属性， $("#txtInput").prop('disabled', true); 设置了disabled属性为 true，则输入框是不可用状态，即不能输入值，也不能选中这个输入框了。
- 09
刷新页面，重新运行后，点击第三个按钮后，效果如图，输入框已是不可用状态。
- 10
最后看下设置readonly的代码，这里也是同样用prop方法，来设置输入框的readonly属性。这个属性和前面的disabled有什么不一样？readonly设置了后，输入框不能输入值，但能选中，并且能复制里面的值。界面上看，和正常的输入框是一样的，不过当你要输入值时，却发现是输入不了的，原来的值是改不了的。 代码和效果如图