Formularz html uniemożliwia przesyłanie po naciśnięciu Enter na konkretnym wejściu

Question

Mam formularz HTML z niektórymi polami wejściowymi, jednym z pól wejściowych jest pole wyszukiwania, po kliknięciu przycisku wyszukiwania obok tego pola wyszukiwania, wyniki wyszukiwania będą być zwrócone z serwera przy użyciu ajax, czego chcę, aby zapobiec wysyłaniu formularza, gdy użytkownik koncentruje się na tym polu wprowadzania danych i naciśnij enter. Przy okazji, używam AngularJS, więc rozwiązanie może trochę różnić się od JQuery lub czysto javascriptowego sposobu, jaki myślę ... Do-able? Każda rada byłaby doceniona!

Answer 1

w obsługi kliknij przycisk zrobić e.preventDefault()

function clickHandler(e){ 
    e.preventDefault(); 
} 

Można również użyć button zamiast przycisku Prześlij.

Answer 2

Użyj funkcji jak:

function doNothing() { 
 
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode; 
 
    if(keyCode == 13) { 
 

 

 
\t if(!e) var e = window.event; 
 

 
\t e.cancelBubble = true; 
 
\t e.returnValue = false; 
 

 
\t if (e.stopPropagation) { 
 
\t \t e.stopPropagation(); 
 
\t \t e.preventDefault(); 
 
\t } 
 
}

<form name="input" action="http://www.google.com" method="get"> 
 
<input type="text" onkeydown="doNothing()"> 
 
<br><br> 
 
<input type="submit" value="Submit"> 
 
</form>

JSFIDDLE HERE

Answer 3

When you submit form using enter key on particular text fields or submit button(focus). 
To prevent form submit twice, we can use both approach 

1. 
define var isEnterHitOnce=true globally which loaded at the time of form load 

on keyPress Event or on submitForm() 

if(event.keycode==13 && isEnterHitOnce){ 
isEnterHitOnce=false; 
//Process your code. Sent request to server like submitForm(); 
} 
isEnterHitOnce=false; 


2. 
disable the field object from where you received the action like 
beginning of method in formSubmit() 
    document.getElementById(objName).disabled=true; // objName would be your fields name like submitButton or userName 


//At the end of method or execution completed enable the field 
    document.getElementById(objName).disabled=false;