Manejar el cambio en JavaScript

I am stuck and need help. I have 5 text boxes: txt1, txt2, txt3, txt4 y la txt5, and there is a function func1(). I want that if there are any changes in any of these text boxes then the function func1() will be called. Can you please help me with how I can do this in JavaScript?

preguntado el 31 de enero de 12 a las 08:01

Answers below are good. If you happen to be unaware of jQuery, you should check it out. -

6 Respuestas

Vincular el onchange evento a tu func1 ()

Será algo como:

<input type="text" onchange="func1()">
<input type="text" onchange="func1()">
<input type="text" onchange="func1()">
<input type="text" onchange="func1()">
<input type="text" onchange="func1()">

(The id/name was not written.)

Respondido el 31 de enero de 12 a las 12:01

Podrías suscribirte al onchange event in those textboxes and call the function:

<input type="text" name="txt1" id="txt1" onchange="func1();" />
<input type="text" name="txt2" id="txt2" onchange="func1();" />
...

or do it unobtrusively:

<input type="text" name="txt1" id="txt1" />
<input type="text" name="txt2" id="txt2" />
...

and then in your javascript file:

window.onload = function() {
    document.getElementById('txt1').onchange = func1;
    document.getElementById('txt2').onchange = func1;
    ...
};

o en un bucle:

window.onload = function() {
    for (var i = 1; i <= 5; i++) {
        document.getElementById('txt' + i).onchange = func1;
    }
};

Respondido el 31 de enero de 12 a las 12:01

I am Using This code in which Input Item is the array containing the Ids of text boxes and isRequestValid is before the call of function. Is it correct? 'code' $(input_item).each(function() { // Save current value of element if ($(this).data('oldVal') != $(this).val()) { isRequestValid = true; $(this).data('oldVal', $(this).val()); } }); - Nabeel Arshad

@user1179868, that's jquery code. Why haven't you explained this in your original question? Please edit your question to include this information. - Darin Dimitrov

<SCRIPT TYPE="text/javascript">

 function function1()
 {
 alert("changed");
 }

 </SCRIPT>

 <INPUT NAME="txt1" onChange="function1()"><BR>
 <INPUT NAME="txt2" onChange="function1()"><BR>
 <INPUT NAME="txt3" onChange="function1()"><BR>

Respondido el 31 de enero de 12 a las 12:01

If you need to get the reference to the element then

    <input type="text" name="txt1" id="txt1" onchange="func1(this);" />
    <input type="text" name="txt2" id="txt2" onchange="func1(this);" />

function func1(item){
  // you have the reference to the item
}

Respondido el 31 de enero de 12 a las 12:01

I see every answer using the "onchange" events in HTML. This is bad practice. See Javascript discreto para entender por qué.

Recomendaría usar document.getElementById('').addEventListener('change', function() {});, but the cross-browser support of this is not the best, so this is why I recommend using jQuery.

In jQuery, you just add the same class to your textboxes, and you can do this :

$('.textBoxes').change(function() {});

I usually don't recommend jQuery when somebody asks for javascript, but this case clearly asks for cross-browser compatibility.

Respondido el 31 de enero de 12 a las 13:01

Utilizan onchange. <input type="text" id="txt1" onchange="func1()" />

Consulte nuestra página JavaScript Event onChange

Respondido el 31 de enero de 12 a las 12:01

I am Using This code [code] $(input_item).each(function() { // Save current value of element if ($(this).data('oldVal') != $(this).val()) { isRequestValid = true; $(this).data('oldVal', $(this).val()); } }); [code] in which Input Item is the array containing the Ids of text boxes and isRequestValid is before the call of function. Is it correct? - Nabeel Arshad

It would be better if you edit your question and add this code snippet for everyone to see. Use jsfiddle.net. - Annie Lagang

Btw, if you're using $(this) then you're using jQuery. Refer to api.jquery.com/change for jQuery change function. - Annie Lagang

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.