jquery - identificar - leer tecla enter con javascript

Haga clic en desencadenantes de evento cuando presione la tecla Entrar en Jquery

Question

Estoy en un gran problema. En mi sitio web, estoy usando un cuadro de búsqueda. Al click/enter presione el resultado de la búsqueda lo redireccionará a la página específica. También me dieron un hide() de resultados de búsqueda cuando hago clic en otras partes de la ventana. El problema es que cuando presiono la tecla Entrar sobre un resultado, ejecuta la función de hacer clic y elimina el contenido de la ventana de salida de búsqueda. Solo necesito borrar el resultado de la búsqueda con un clic del mouse.

Este es mi código de evento click

$(document).click(function (e) {
if (!$(e.target).is(''#search_result'')) {
$("#search_result").hide();
$("#search_result").html("");
}
});

y mi evento de entrada es

function TriggerSearch(e) {
var search_string = $("#search").val();
e = e || window.event;
var keycode;
if (window.event) {
keycode = e.which ? window.event.which : window.event.keyCode;
}
var key = e.which;
switch (key) {
case 38:
break;
case 40:
break;
case 13:
search_product();
break;
default:
default function();
}
}

La llamada a TriggerSearch es

$("#search").keyup(TriggerSearch);

Estas 3 partes contienen el flujo de trabajo. Cuando presiona Enter , en lugar de ir a la función search_product() , ejecuta el evento click. No ingresó a la función search_product() . Según mi conocimiento, cuando se produce un evento de click en #search , irá a la función TriggerSearch() y si es 13, entonces ejecuta la función search_product() . No puedo entender por qué esto no sucede.

¿Cómo puedo evitar ejecutar el evento click al presionar la tecla Entrar ?

Answer 1

Mi primera sugerencia sería no usar un controlador de clics global. En lugar de vincularlo al campo de búsqueda $(''#searchField'').click() . En segundo lugar, es posible que desee utilizar desenfoques y eventos de enfoque en el cuadro de búsqueda para activar el ocultamiento de contenido.

Una demostración en vivo ayudaría a reducir lo que está tratando de lograr también.

Answer 2

preventdefault() debería hacer el truco (ya que está pasando el objeto de evento estándar a TriggerSearch través del evento keyup ). Actualización: debe utilizar el evento de keypress lugar de la keyup ya que es el que activa un envío de formulario.

case 13:
e.preventDefault();
search_product();

De lo contrario, publique el resto del código :)

Actualizar:

El problema es que el envío de formularios predeterminado se activa al presionar teclas, no al teclado. Lo cambié para usar la keypress y el preventDefault (capital D, lo siento) ahora funciona:

JSFiddle: http://jsfiddle.net/TrueBlueAussie/qLK94/1/

function search_product() {
alert("search_product()");
}
function TriggerSearch(e) {
var search_string = $("#search").val();
e = e || window.event;
var keycode;
if (window.event) {
keycode = e.which ? window.event.which : window.event.keyCode;
}
var key = e.which;
switch (key) {
case 38:
break;
case 40:
break;
case 13:
e.preventDefault();
search_product();
break;
default:
break;
}
}
$("#search").keypress(TriggerSearch);

Para probar, comente e.preventDefault(); en JSFiddle y la página intentará enviar en Enter.

Actualización (no es necesario enviar el botón)

jsFiddle: http://jsfiddle.net/TrueBlueAussie/qLK94/2/

En base a los comentarios a continuación, debo aclarar que la acción de envío que mencioné no está relacionada con el botón de enviar, sino con el formulario. Este ejemplo no tiene submit, pero hace lo que se quiere.

Nota: tuve que eliminar su default function() ya que dio un error. ¿Qué se supone que debe hacer?