jquery - una - Detectar el cuadro de texto de entrada cambiado

obtener texto de textarea jquery

Question

He mirado muchas otras preguntas y he encontrado respuestas muy simples, incluido el código a continuación. Simplemente quiero detectar cuando alguien cambia el contenido de un cuadro de texto, pero por alguna razón no funciona ... no obtengo errores de consola. Cuando configuro un punto de interrupción en el navegador en la función change() , nunca lo alcanza.

$(''#inputDatabaseName'').change(function () { 
    alert(''test''); 
});

<input id="inputDatabaseName">

Answer 1

A cada respuesta le faltan algunos puntos, así que aquí está mi solución:

$("#input").on("input", function(e) {
  var input = $(this);
  var val = input.val();

  if (input.data("lastval") != val) {
    input.data("lastval", val);

    //your change action goes here 
    console.log(val);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">
<p>Try to drag the letters and copy paste</p>

El Input Event activa en la entrada del teclado , arrastre con el ratón , autocompletar y copiar y pegar probado en Chrome y Firefox. La comprobación del valor anterior hace que detecte cambios reales, lo que significa que no se dispara al pegar lo mismo o al escribir el mismo carácter o etc.

Ejemplo de trabajo: http://jsfiddle.net/g6pcp/473/

actualizar:

Y si desea ejecutar su change function solo cuando el usuario termina de escribir y evita disparar la acción de cambio varias veces, puede intentar esto:

var timerid;
$("#input").on("input", function(e) {
  var value = $(this).val();
  if ($(this).data("lastval") != value) {

    $(this).data("lastval", value);
    clearTimeout(timerid);

    timerid = setTimeout(function() {
      //your change action goes here 
      console.log(value);
    }, 500);
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">

Si el usuario comienza a escribir (por ejemplo, "foobar"), este código impide que se ejecute su change action para cada tipo de usuario de letra y solo se ejecuta cuando el usuario deja de escribir. , de esa manera el servidor realiza solo una búsqueda de foobar y no seis búsquedas de f y luego fo y luego foo y foob y así sucesivamente.

Answer 2

Creo que puedes usar keydown también:

$(''#fieldID'').on(''keydown'', function (e) {
  //console.log(e.which);
  if (e.which === 8) {
    //do something when pressing delete
    return true;
  } else {
    //do something else
    return false;
  }
});

Answer 3

En mi caso, tenía un cuadro de texto que estaba adjunto a un selector de fechas. La única solución que funcionó para mí fue manejarlo dentro del evento onSelect del selector de fechas.

<input type="text"  id="bookdate">

$("#bookdate").datepicker({            
     onSelect: function (selected) {
         //handle change event here
     }
});

Answer 4

Las entradas de texto no activan el evento de change hasta que pierden el enfoque. Haga clic fuera de la entrada y se mostrará la alerta.

Si la devolución de llamada debe .keyup() antes de que el ingreso de texto pierda el enfoque, use el evento .keyup() .

Answer 5

Puedes usar el evento oninput como en jQuery así:

$(''#inputDatabaseName'').on(''input'',function(e){
    alert(''Changed!'')
});

En JavaScript puro

document.querySelector("input").addEventListener("change",function () {
  alert("Input Changed");
})

O así:

<input id="inputDatabaseName" onchange="youFunction();"
onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();"/>

Answer 6

TRABAJANDO:

$("#ContentPlaceHolder1_txtNombre").keyup(function () {
    var txt = $(this).val();
        $(''.column'').each(function () {
            $(this).show();
            if ($(this).text().toUpperCase().indexOf(txt.toUpperCase()) == -1) {
                $(this).hide();
            }
        });
    //}
});

Answer 7

prueba keyup en lugar de cambiar.

<script type="text/javascript">
   $(document).ready(function () {
       $(''#inputDatabaseName'').keyup(function () { alert(''test''); });
   });
</script>

Aquí está la documentación oficial de jQuery para .keyup () .

Answer 8

onkeyup, onpaste, onchange, oninput parece estar fallando cuando el navegador realiza autocompletar en los cuadros de texto. Para manejar este caso, incluya " autocomplete=''off'' " en su campo de texto para evitar que el navegador complete automáticamente el cuadro de texto,

P.ej,

<input id="inputDatabaseName" autocomplete=''off'' onchange="check();"
 onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();" />

<script>
     function check(){
          alert("Input box changed");
          // Things to do when the textbox changes
     }
</script>