如何在javascript中自动点击输入字段onchange上的按钮



当金额为>0并且选择了下拉菜单

<html>
<head>
<script>
document.getElementById("changeLanguage").onchange = function() {
if (inputtxt.value.length == 0) {
$('#bt').trigger('click');
}
};
</script>
</head>
<body>
<label for="fname">Amount</label><input type="number" id="amt" name="amt">
<select onchange="changeLanguage(this.value)">
<option value="Choose" selected="selected">Choose</option>
<option value="IT">Italian</option>
<option value="FR">France</option>
</select>
<button type="button" id="bt">Click Me!</button>
</body>
</html>

我尝试过使用上面的代码,但没有成功。

如果amount意味着值,那么您应该在If条件中比较inputtxt.value > 0

document.getElementById("changeLanguage").onchange = function() { 
if (inputtxt.value > 0) {
$('#bt').trigger('click'); 
} 
};

您有几个地方需要调整。

首先你应该看到错误消息

未捕获类型错误:无法设置null的属性(设置"onchange"(

这是因为您没有设置select元素id属性。

所以更换

<select onchange="changeLanguage(this.value)">

带有

<select id="changeLanguage" onchange="changeLanguage(this.value)">

此外,如果您已经有jquery,建议不要使用内联事件,并且实际上没有changeLanguage方法。

所以更换

<select id="changeLanguage" onchange="changeLanguage(this.value)">

带有

<select id="changeLanguage">

当您进行调整时,您会发现更改事件正在侦听,但您应该看到错误消息

未捕获引用错误:inputtxt未定义

这是因为您没有声明inputtxt变量。

所以请添加这行

const inputtxt = document.getElementById('amt').value;

完整的代码显示在下方

document.getElementById('changeLanguage').onchange = function() {
const inputtxt = document.getElementById('amt').value;
if (inputtxt.length == 0) {
$('#bt').trigger('click');
}
};

但是我观察到您已经使用了jquery,您可以参考以下代码。

$('#changeLanguage').on('change', () => {
if ($('#amt').val().length == 0) {
$('#bt').trigger('click');
}
});

例如

$('#changeLanguage').on('change', () => {
if ($('#amt').val().length == 0) {
$('#bt').trigger('click');
}
});
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<label for="fname">Amount</label>
<input type="number" id="amt" name="amt">
<select id="changeLanguage">
<option value="Choose" selected="selected">Choose</option>
<option value="IT">Italian</option>
<option value="FR">France</option>
</select>
<button type="button" id="bt">Click Me!</button>
</body>
</html>

我认为您可以直接触发function而不是click action

document.getElementById("changeLanguage").addEventListener(
'change',
function(e) {
if (e.currentTarget.value.length === 0) {
submit()
}
)
)
<body>
<label for="fname">Amount</label>
<input type="number" id="amt" name="amt">
<select id="changeLanguage">
<option value="Choose" selected="selected">Choose</option>
<option value="IT">Italian</option>
<option value="FR">France</option>
</select>
<button type="button" id="bt" onclick="submit()">Click Me!</button>
</body>

最新更新