Mam formularz HTML z jednym submit
wejściem, ale także różnymi button
elementami. Gdy użytkownik naciśnie klawisz „enter”, spodziewałbym się, że faktycznie prześle formularz, ale zamiast tego (przynajmniej w przeglądarce Chrome 15) stwierdzam, że uruchamia pierwszy button
(ponieważ występuje to wcześniej w kodzie HTML niż dane submit
wejściowe , Zgaduję).
Wiem, że generalnie nie można zmusić przeglądarek do faworyzowania określonego submit
wejścia, ale naprawdę sądziłem, że będą preferować submit
dane wejściowe nad button
elementami. Czy mogę wprowadzić jakieś drobne poprawki w kodzie HTML, aby to zadziałało, czy też będę musiał zastosować jakieś podejście do języka JavaScript?
Oto przybliżona makieta kodu HTML:
<form action="form.php" method="POST">
<input type="text" name="field1"/>
<button onclick="return myFunc1()">Button 1</button>
<input type="submit" name="go" value="Submit"/>
</form>
Odpowiedzi:
Nie potrzebujesz JavaScript, aby wybrać domyślny przycisk lub wejście przesyłania. Wystarczy oznaczyć go
type="submit"
, a pozostałe przyciski oznaczyć jetype="button"
. W twoim przykładzie:<button type="button" onclick="return myFunc1()">Button 1</button> <input type="submit" name="go" value="Submit"/>
źródło
type="button"
jest to, że domyślnie elementy przycisków sątype="submit"
. Tak więc założenie w pytaniu, że był tylko jeden przycisk przesyłania, było w rzeczywistości błędne.Możesz użyć jQuery:
$(function() { $("form input").keypress(function (e) { if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) { $('button[type=submit] .default').click(); return false; } else { return true; } }); });
źródło
button[type=submit]
znaku, zakładając, że oznaczyłeś swój domyślny przyciskdefault
wysyłania klasą css.Spróbuj tego, jeśli został naciśnięty klawisz Enter, możesz to uchwycić w ten sposób, na przykład opracowałem odpowiedź na drugi dzień przycisk html określ wybrany , zobacz, czy to pomaga.
Podaj nazwę formularza, na przykład
yourFormName
wtedy powinieneś móc przesłać formularz bez koncentrowania się na formularzu.document.onkeypress = keyPress; function keyPress(e){ var x = e || window.event; var key = (x.keyCode || x.which); if(key == 13 || key == 3){ // myFunc1(); document.yourFormName.submit(); } }
źródło
Właśnie mam z tym problem. Mój był spadek po zmianie na
input
abutton
i miałem źle napisany/>
terminator tagu:Więc miałem:
<button name="submit_login" type="submit" class="login" />Login</button>
I właśnie zmieniłem to na:
<button name="submit_login" type="submit" class="login">Login</button>
Teraz działa jak urok, zawsze irytujące małe rzeczy ... HTH
źródło
$("form#submit input").on('keypress',function(event) { event.preventDefault(); if (event.which === 13) { $('button.submit').trigger('click'); } });
źródło
Biorąc pod uwagę, że istnieje tylko jeden (lub w przypadku tego rozwiązania potencjalnie nawet nie jeden) przycisk przesyłania, oto rozwiązanie oparte na jQuery, które będzie działać dla wielu formularzy na tej samej stronie ...
<script type="text/javascript"> $(document).ready(function () { var makeAllFormSubmitOnEnter = function () { $('form input, form select').live('keypress', function (e) { if (e.which && e.which == 13) { $(this).parents('form').submit(); return false; } else { return true; } }); }; makeAllFormSubmitOnEnter(); }); </script>
źródło
Właśnie dałem temu wir w Chrome i Firefoxie i IE10.
Jak wspomniano powyżej - upewnij się, że zaznaczyłeś typ = "przycisk", "reset", "wyślij" itp., Aby upewnić się, że poprawnie kaskaduje i wybiera właściwy przycisk.
Być może ustawienie wszystkich z nich tak, aby miały tę samą formę (tj. Wszystkie, które działały dla mnie)
źródło