jQuery. ¿Obtiene el valor del campo de entrada de texto en el evento de clic de botón?

Question

html:

<div id="search"> 
    <input id="term" type="text" value="enter your search" /> 
    <button id="hit" type="button" name="">Search</button> 
</div> 

jQuery:

$(document).ready(function() { 
    var term = $('#term').val(); 
    $('#hit').click(function() { 
    alert(term); 
    }); 
}); 

El problema es que, no importa lo que escriba en el campo de entrada, después haga clic en el botón, siempre alerta al valor de entrada original que es " ingrese su búsqueda ".

¿Cómo puedo repararlo?

Answer 1

El problema que tienes es que todo este bloque de código se ejecuta en el evento listo para DOM.

var term = $('#term').val(); se está evaluando solo una vez y se almacena 'ingrese su búsqueda' en el término variable. Esta es la razón por la que no importa a qué cambie el valor, la variable aún conserva el valor inicial cuando se procesó la página.

En cambio, lo que debe hacer es algo más parecido a lo siguiente:

jQuery

$(document).ready(function() { 
    $('#hit').click(function() { 
    alert($('#term').val()); 
    }); 
}); 

En este trozo de código, se evalúa el valor del elemento con plazo ID cuando se dispara el detector de eventos click .

Answer 2

que necesita para obtener el valor de click, en lugar de document ready

$(document).ready(function() { 
    $('#hit').click(function() { 
    var term = $('#term').val(); 
    alert(term); 
    }); 
}); 

Answer 3

Debido a que ha creado la variable justo cuando el documento esté listo .. intenta crear el "término" variable dentro de la función de clic. ..

$(document).ready(function() { 
     $('#hit').click(function(event) { 
      var term = $('#term').val(); 
      alert(term); 
     }); 
    });​