jquery 无法监听 readonly的input 值的变化
时间: 2024-02-02 08:03:42 浏览: 42
确实,jQuery是无法监听readonly属性的input的值变化的。因为`readonly`属性会阻止用户对`input`元素进行编辑,而jQuery的`change()`事件只会在用户进行编辑时才会触发。
如果确实需要监听readonly属性的input值变化,可以使用原生的JavaScript方法进行监听。例如,可以使用`setInterval()`方法定时检查`input`元素的值是否发生了变化,然后在检测到值变化时执行相应的处理逻辑。代码示例如下:
```javascript
var oldValue = $('input').val();
setInterval(function() {
var newValue = $('input').val();
if (oldValue !== newValue) {
// input的值发生变化
oldValue = newValue;
// 处理逻辑
}
}, 100);
```
在上面的代码中,我们初始化了一个变量`oldValue`,并使用`setInterval()`方法在每100毫秒内检查`input`元素的值是否发生了变化。如果检测到值变化,则执行相应的处理逻辑。需要注意的是,这种方式可能会影响性能,因为它会在页面上频繁地执行检查。
相关问题
jquery 如何监听 readonly的input变化
jquery可以通过`prop`方法获取和设置input的属性值,包括readonly属性。要监听readonly的input变化,可以使用`setInterval`方法在一定时间间隔内检查readonly属性的值是否改变,代码如下:
```javascript
var oldValue = $('input').prop('readonly');
setInterval(function() {
var newValue = $('input').prop('readonly');
if (oldValue !== newValue) {
// readonly属性值发生改变
oldValue = newValue;
// 处理逻辑
}
}, 100);
```
在上面的代码中,我们初始化了一个变量`oldValue`,通过`prop`方法获取`input`元素的`readonly`属性值。然后我们使用`setInterval`方法,在每100毫秒内检查`input`元素的`readonly`属性值是否发生了改变,如果发生改变则执行相应的处理逻辑。
jquery 如何监听 readonly的input value变化
如果要监听`readonly`的`input`的`value`变化,可以使用`MutationObserver`,它可以监听DOM树的变化并作出相应的反应。代码如下:
```javascript
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'attributes' && mutation.attributeName === 'value') {
// value属性值发生改变
// 处理逻辑
}
});
});
var target = $('input')[0];
var config = { attributes: true };
observer.observe(target, config);
```
在上面的代码中,我们创建了一个`MutationObserver`对象,并且使用`observe`方法监听了`input`元素的变化。当`input`元素的`value`属性发生改变时,`MutationObserver`会检测到这个变化并且执行相应的处理逻辑。