修改

Question

我有一个HTML输入元素。

<input type = "hidden" name = "MY_ELEMENT" id = "MY_ELEMENT" />

元素最初没有任何价值。

有一个JavaScript函数可以设置input元素的值。我想在input元素获取值时执行另一个JavaScript函数。可以肯定的是，所述元素将获得一些价值，但这可能需要一些时间。

我尝试使用while循环，但这使得页面无响应。我想在输入元素获得某个值之后运行函数 anotherJSFunction（）。

while(document.getElementById("MY_ELEMENT").value == "") {
    console.log('Waiting for the element to get some value.');
}

anotherJSFunction();

请为此问题提出一些替代方案。

Answer 1

您创建了错误的功能。有一些方法可以做到这一点。

在HTML

<input onchange="myFunction()" />或 <input onkeyup="myFunction()" />

在JS中为该元素创建一个eventListener：

document.getElementById("My_Element").addEventListener("change", function(){ //Do something });
如果你正在使用JQuery，你可能会这样做：

$("#My_Element").on("keyup", function(){ //do something })

修改

表单已隐藏。我想你可以这样做：

function hiddenValue(){
    var hvalue = "some_value";
    document.getElementById("hiddenForm").innerHTML = '<input type="hidden" value="' + hvalue + '" name="element" id="element" />';

    //Call another function:
    //Or you can pass the value to the function like thid:
    //doSomething(hvalue);
    doSomething();
}

function doSomething(hvalue = ''){
    //do in here
}

在HTML中，只需将div或span与id="hiddenForm"

Answer 2

也许使用自定义setter和getter可能有所帮助。

＆＃13;

var el = document.getElementById('my-element');
el._value = el.value;
Object.defineProperty(el, "value", {
    get: () => this._value,
    set: (newValue) => {
        console.log('Set: ' + newValue);
        // The value has been changed, do things here
        this._value = newValue;
    }
});

// This is to simulate the input's value being programmatically set at a later time
setTimeout(() => {
  el.value='100'
  console.log('Value programmtically updated: ' + el.value);
},2000);

＆＃13;

<input type="hidden" id="my-element" />

＆＃13;

等待HTML输入元素获取值

2 个答案:

修改