Question

简短说明

我想在禁用文本框值更改时执行某些操作

详细说明

我有一个禁用的文本框，其值是以编程方式设置我想绑定禁用文本框的更改事件以触发其他一些功能。这是我尝试但不起作用的。

$('#Rate').change(function() {
           // alert("Change Event Called");
            CalculateMedicine();
        });

$('input[id$=Rate]').bind("change", function () {
            CalculateMedicine();
        });

这两件事对我都不起作用，我不喜欢把函数CalculateMedicine()放到可能Rate文本框正在改变的所有地方。所以除此之外解决方案任何帮助将不胜感激

Answer 1

如果以编程方式更改值，则不会触发change事件

请参阅https://stackoverflow.com/a/7878081/3052648

不优雅可能的解决方案：

function checkChanges(){
    if(prevRate != $('#Rate').val()){
        prevRate = $('#Rate').val();
        alert('changed');
    }
}

var prevRate;
$(document).ready(function(){
    prevRate = $('#Rate').val();
    setInterval(function(){
        checkChanges();
    } ,500);
});

Answer 2

您可以使用trigger进行更改活动：

<input type="text" disabled="disabled" name="fname" class="myTextBox" ><br>
<input type="button" name="submit" id="submit" value="Submit">

使用Javascript：

$(".myTextBox").change(function(){
  console.log("yes i m working");
});

$("#submit").click("input", function() {
     $(".myTextBox").val("New value").trigger("change");
});

检查Demo

Answer 3

假设您的输入在点击或其他内容上禁用了类，您可以像这样检查

 if ($( "#input" ).hasClass( "disable" )) {
Your logics and codes here //


}

//希望这会有所帮助

Answer 4

如果重新定义该输入的value属性，则有可能。

<html>
    <head>
        <script>
            function Init(){
                var tE = document.querySelector('input'); //Our input field.

                //We redefine the value property for the input
                tE._value = tE.value;
                Object.defineProperty(tE, 'value', {
                    get: function(){return this._value},
                    set: function(v){
console.log(1, 'The value changed to ' + v)
                        this._value = v;
                        this.setAttribute('value', v) //We set the attribute for display and dom reasons
                        //Here we can trigger our code
                    }
                })
            }

            function Test(){
                //In one second we are going to change the value of the input
                window.setTimeout(function(){
                    var tE = document.querySelector('input'); //Our input field.
                    tE.value = 'Changed!'
console.log(0, 'Changed the value for input to ' + tE.value)
                }, 1000)
            }
        </script>
    </head>

    <body onload = 'Init(); Test();'>
        <input type = 'text' disabled = 'true' value = 'Initial' />
    </body>
</html>

https://jsfiddle.net/v9enoL0r/

Answer 5

无论您要触发更改事件或任何其他事件，都可以通过以下代码触发更改事件。无论值是否更改，都会触发该事件。只需将代码放置在以编程方式更改值的位置即可。

element.dispatchEvent(new Event('change'))

let input = document.querySelector("input");
input.addEventListener("change", () => alert("Change Event is Fired"));
input.value = "xyz";
input.dispatchEvent(new Event("change"));

<input type="text" disabled value="abc">

禁用文本框更改事件

5 个答案: