JQuery ile 'Enter'a bir form gönderiliyor mu?

Bir bataklık standart giriş formu - e-posta metin alanı, parola alanı ve HTML / jQuery kullanan bir AIR projesinde bir gönderme düğmesi var. Formda Enter tuşuna bastığımda, tüm formun içeriği kaybolur, ancak form gönderilmez. Herkes bunun bir Webkit sorunu olup olmadığını biliyor mu (Adobe AIR HTML için Webkit kullanıyor) veya bir şeyleri tıkadım mı?

Denedim:

$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
  }
});

Ancak bu, temizleme davranışını durdurmadı veya formu göndermedi. Formla ilişkili herhangi bir işlem yok - sorun bu olabilir mi? Eyleme bir javascript işlevi koyabilir miyim?

$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
    return false;    //<---- Add this line
  }
});

Bu yığın akışı yanıtına göz atın : event.preventDefault () ve return false

Esasen, "dönüş false" çağıran aynıdır e.preventDefaultve e.stopPropagation().

Jason Cohen'in de bahsettiği gibi yanlış dönüşe ek olarak. Ayrıca,

e.preventDefault();

Yardımcı olup olmayacağını bilmiyorum, ancak doğrudan formu göndermek yerine bir gönder düğmesini tıklamayı simüle etmeyi deneyebilirsiniz. Üretimde aşağıdaki kodu var ve iyi çalışıyor:

    $('.input').keypress(function(e) {
        if(e.which == 13) {
            jQuery(this).blur();
            jQuery('#submit').focus().click();
        }
    });

Not: jQuery ('# send'). Focus () , enter tuşuna basıldığında düğmeyi canlandırır.

falseTuş vuruşunun devam etmesini önlemek için geri dönün .

Enter tuşunu bağlamanız ve test etmeniz için herhangi bir neden var mı?

Sadece bir

<input type="submit" /> 

ve forma itildiğinde doğal olarak gönderilsin mi? Daha sonra formun onsubmiteylemini bağlayabilir ve isterseniz bir doğrulama işlevi çağırabilirsiniz ...

onsubmitFormunuzun gönderilip gönderilmediğini görmek için test olarak bile kullanabilirsiniz , ancak aradığınızda çalışmaz form.submit().

Bunu bir JQuery eklentisi olarak yapmanın bir yolu (işlevselliği yeniden kullanmak istiyorsanız):

$.fn.onEnterKey =
    function( closure ) {
        $(this).keypress(
            function( event ) {
                var code = event.keyCode ? event.keyCode : event.which;

                if (code == 13) {
                    closure();
                    return false;
                }
            } );
    }

Şimdi bir <input>öğeyi bu tür işlevselliklerle süslemek istiyorsanız , bu kadar basit:

$('#your-input-id').onEnterKey(
    function() {
        // Do stuff here
    } );

onsubmit="return false"Varsayılan davranışı önlemek için sayfadaki form koduna da ekleyebilirsiniz .

Sonra form olayını javascript dosyasındaki jQuery ile herhangi bir işleve kanca ( .bindveya .live) submit.

İşte size yardımcı olacak bir örnek kod:

HTML

<form id="search_form" onsubmit="return false">
   <input type="text" id="search_field"/>
   <input type="button" id="search_btn" value="SEARCH"/>
</form>

Javascript + jQuery

$(document).ready(function() {

    $('#search_form').live("submit", function() {
        any_function()
    });
});

Bu, 2011-04-13 itibariyle Firefox 4.0 ve jQuery 1.4.3 ile çalışıyor

Bu benim kodum:

  $("#txtMessage").on( "keypress", function(event) {
    if (event.which == 13 && !event.shiftKey) {
        event.preventDefault();
        $("#frSendMessage").submit();
    }
    });

Ayrıca erişilebilirliği korumak için anahtar kodunuzu belirlemek için bunu kullanmalısınız:

c = e.which ? e.which : e.keyCode;

if (c == 13) ...

Kolay uygulama için ekleme. Bir form oluşturabilir ve ardından gönder düğmesini gizleyebilirsiniz:

Örneğin:

<form action="submit.php" method="post">
Name : <input type="text" name="test">
<input type="submit" style="display: none;">
</form>

Şimdi kullanıyorum

$("form").submit(function(event){
...
}

İlk başta, gönder düğmesine bir hata işleyici ekledim, bu da benim için hata üretti.

Bugün Enter tuşuna basıldığında keypress olayının tetiklenmediğini öğrendim, bu yüzden bunun yerine keydown () veya keyup () 'a geçmek isteyebilirsiniz.

Test senaryom:

        $('.module input').keydown(function (e) {
            var keyCode = e.which;
            console.log("keydown ("+keyCode+")")
            if (keyCode == 13) {
                console.log("enter");
                return false;
            }
        });
        $('.module input').keyup(function (e) {
            var keyCode = e.which;
            console.log("keyup ("+keyCode+")")
            if (keyCode == 13) {
                console.log("enter");
                return false;
            }
        });
        $('.module input').keypress(function (e) {
            var keyCode = e.which;
            console.log("keypress ("+keyCode+")");
            if (keyCode == 13) {
                console.log("Enter");
                return false;
            }
        });

Klavyede "A Enter B" yazarken konsoldaki çıkış:

keydown (65)
keypress (97)
keyup (65)

keydown (13)
enter
keyup (13)
enter

keydown (66)
keypress (98)
keyup (66)

İkinci sırada 'tuşa basma' eksik, fakat tuşa basma ve tuşa basma kayıt kodu '13' basılı / bırakılmış olarak görüyorsunuz. Uyarınca () işlevi bir tuşa basarak jQuery belgeler :

Note: as the keypress event isn't covered by any official specification, the actual behavior encountered when using it may differ across browsers, browser versions, and platforms.

Server 2012 R2 üzerinde IE11 ve FF61 üzerinde test edilmiştir

HTML kodlarında:

<form action="POST" onsubmit="ajax_submit();return false;">
    <b>First Name:</b> <input type="text" name="firstname" id="firstname">
    <br>
    <b>Last Name:</b> <input type="text" name="lastname" id="lastname">
    <br>
    <input type="submit" name="send" onclick="ajax_submit();">
</form>

Js kodlarında:

function ajax_submit()
{
    $.ajax({
        url: "submit.php",
        type: "POST",
        data: {
            firstname: $("#firstname").val(),
            lastname: $("#lastname").val()
        },
        dataType: "JSON",
        success: function (jsonStr) {
            // another codes when result is success
        }
    });
}

Bunu dene:

var form = document.formname;

if($(form).length > 0)
{
    $(form).keypress(function (e){
        code = e.keyCode ? e.keyCode : e.which;
        if(code.toString() == 13) 
        {
             formsubmit();
        }
    })
}