jQuery实现禁用input输入框的方法

jQuery实现禁用input输入框的方法

在开发 web 应用时，经常需要禁用表单中的某些输入框，比如某些敏感信息只允许展示而不允许修改。本文将介绍如何使用 jQuery 实现禁用 input 输入框的方法。

禁用 input 输入框的方法可以使用 jQuery 提供的 `prop()` 方法。该方法用于设置元素的属性值，可以设置的属性包括 `disabled`，它表示元素是否禁用。

下面是禁用 id 为 input1 的输入框的代码：

```javascript
$('#input1').prop('disabled','disabled');
```

如果想要将一个禁用的输入框重新启用，可以使用以下代码：

```javascript
$('#input1').prop('disabled',false);
```

除了上述方法之外，也可以使用 `attr()` 方法来禁用输入框，但在 jQuery 版本 1.6 之后，推荐使用 `prop()`。

当然，如果需要禁用多个输入框，可以使用 jQuery 的 `each()` 方法遍历每个输入框进行禁用：

```javascript
$('input[type="text"]').each(function(){
$(this).prop('disabled','disabled');
});
```

上述代码可以禁用所有类型为 `text` 的输入框。

需要注意的一点是，如果想禁止用户提交被禁用的表单元素的值，那么应该使用 `readonly` 属性而不是 `disabled` 属性。`readonly` 的输入框在表单提交时会包含在表单中，而被禁用的输入框不会。

综上所述，通过使用 jQuery 的 `prop()` 方法，可以快速方便地禁用输入框，提高 web 应用的开发效率。