Question

我正在尝试在input_1文本框的值更改时触发函数。

即。 getElementById（'input_1'）。onchange结果对象不是函数。

HTML

<form method="GET" id="game_form"></form>
<table border="1" style="background-color:#FFFFCC;border-collapse:collapse;border:1px solid #FFCC00;color:#000000;width:100" cellpadding="3" cellspacing="3">
  <tr>
    <td id="cell_1"><input type="text" id="input_1" form="game_form" value="x"></td>
    <td id="cell_2"><input type="text" id="input_2" form="game_form"></td>
    <td id="cell_3"><input type="text" id="input_3" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_4"><input type="text" id="input_4" form="game_form"></td>
    <td id="cell_5"><input type="text" id="input_5" form="game_form"></td>
    <td id="cell_6"><input type="text" id="input_6" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_7"><input type="text" id="input_7" form="game_form"></td>
    <td id="cell_8"><input type="text" id="input_8" form="game_form"></td>
    <td id="cell_9"><input type="text" id="input_9" form="game_form"></td>
  </tr>
</table>

的Javascript

$(window).load(
    function checkInput() {
//        alert("I am an alert box!1");
        var cell = document.getElementById('input_1');
        alert(cell.value);
        **document.getElementById('input_1').onchange**(
            doSomething()
        );
    }
);


function doSomething(){
    alert("I am an alert box!2");

}

Answer 1

您使用了错误的语法。你想要addEventListener

var el = document.getElementById("input_1");
el.addEventListener("change", doSomething, false);

或者使用jQuery：

var $el = $('#input_1');
$el.on('change', doSomething);

Answer 2

您需要使用jQuery选择器绑定onchange或使用javascript事件绑定方法来实现此目的。

所以这将是$('#input_1').change(function() { });

OR

var myEl = document.getElementById('input_1');

myEl.addEventListener('change', function() {
   // do something
}, false);

Answer 3

问题在于.onchange是属性，而不是函数。

顺便说一句，您可以使用jQuery .on()：

$('#input_1').on("change", function()
{
    doSomething();
});

.on("change", ...的{{3}}快捷方式：

$('#input_1').change(function()
{
    doSomething();
});

如果你想要使用onclick代替.change()和.addEventListener()，你可以这样使用它：

document.getElementById('input_1').onchange = doSomething;

.change()

Answer 4

尝试：

$('#input_1').change(function(){
    alert('changed');
});

这会有效！

Answer 5

Onchange不是一个函数，是一个属性。您必须将onchange设置为等于所需的函数。

document.getElementById('input_1').onchange = function(){
//Do what you want
}

Answer 6

由于问题用jquery标记，您可以使用以下

$(document).ready(function(){ // when all DOM is loaded
    $('#input_1').on('change',function(){ // # is id based selector
        // you event handler logic
    });
});

希望它有所帮助...

Answer 7

试试这个......

$(document).ready(function(){ // When DOM is ready...
	$('input').on('change',function(){ // Every Input field would get into this Event... to change only for id=input_1 -> '#input_1'
		//Alternative to 'change' would be 'keyup', because change is only called when the input field losts his focus...
		alert(this.id);
		switch(this.id)
        {
            case 'input_1': alert('input 1!');
              break;
            case 'input_2': alert('input 2!');
              break;
            //....
        }
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1" style="background-color:#FFFFCC;border-collapse:collapse;border:1px solid #FFCC00;color:#000000;width:100" cellpadding="3" cellspacing="3">
  <tr>
    <td id="cell_1"><input type="text" id="input_1" form="game_form" value="x"></td>
    <td id="cell_2"><input type="text" id="input_2" form="game_form"></td>
    <td id="cell_3"><input type="text" id="input_3" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_4"><input type="text" id="input_4" form="game_form"></td>
    <td id="cell_5"><input type="text" id="input_5" form="game_form"></td>
    <td id="cell_6"><input type="text" id="input_6" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_7"><input type="text" id="input_7" form="game_form"></td>
    <td id="cell_8"><input type="text" id="input_8" form="game_form"></td>
    <td id="cell_9"><input type="text" id="input_9" form="game_form"></td>
  </tr>
</table>

问候

getElementById onchange结果中的对象不是函数

7 个答案: