TA貢獻1796條經驗 獲得超4個贊
您可以通過覆蓋輸入value屬性的 setter 函數來實現這一點。因此，每次有人以value編程方式設置時，您的覆蓋設置器都會被觸發：
const input = document.getElementById('input');
const descriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value');
Object.defineProperty(input, 'value', {
set: function(t) {
console.log('Input value was changed programmatically');
return descriptor.set.apply(this, arguments);
},
get: function() {
return descriptor.get.apply(this);
}
});
function changeInput() {
input.value += '1';
}
<input id="input">
<button onclick="changeInput()">Change</button>
TA貢獻1826條經驗 獲得超6個贊
要以編程方式觸發事件，您可以使用事件 API：https : //developer.mozilla.org/fr/docs/Web/API/EventTarget/dispatchEvent
完整示例：
let input = document.getElementById('a')
// Listen the event
input.addEventListener('change', function (evt) {
console.log('onchange event listener')
});
input.onchange = () => {
console.log('onchange callback')
}
setTimeout(() => {
input.value = "myvalue"
// Trigger the event
var event = new Event('change');
input.dispatchEvent(event);
}, 1000)
<input id="a">
TA貢獻1946條經驗 獲得超4個贊
對于以編程方式更改輸入標簽中的值，您可以使用triggers.
$(document).on('mytrigger keyup', '#input_num', function() {
var value = $('#input_num').val();
//alert(value);
$('#result').val(value)
})
function external_modifier(){
setTimeout(function(){
var intValue = parseInt($('#input_num').val(), 10);
$('#input_num').val(intValue+1).trigger("mytrigger");
//alert(intValue);
external_modifier();
}, 3000);
}
external_modifier();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<lable> Input: </lable><input id='input_num' type=text value=1 />
<br><br>
<lable> Result: </lable><input id='result' type=text disabled />
舉報