Gửi biểu mẫu trên 'Enter' bằng jQuery?

Tôi có một hình thức đăng nhập bog tiêu chuẩn - một trường văn bản email, một lĩnh vực mật khẩu và một nút gửi trên một dự án AIR đó là sử dụng HTML / jQuery. Khi tôi nhấn Enter trên biểu mẫu, toàn bộ nội dung của biểu mẫu sẽ biến mất, nhưng biểu mẫu không được gửi. Có ai biết đây có phải là sự cố của Webkit không (Adobe AIR sử dụng Webkit cho HTML) hoặc nếu tôi đã làm hỏng mọi thứ?

Tôi đã thử:

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

Nhưng điều đó không ngăn chặn hành vi bù trừ, hoặc gửi biểu mẫu. Không có hành động liên quan đến biểu mẫu - đó có thể là vấn đề không? Tôi có thể đặt một hàm javascript trong hành động không?

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

Kiểm tra câu trả lời stackoverflow này: event.preventDefault () so với return false

Về cơ bản, "return false" giống như gọi e.preventDefaultvà e.stopPropagation().

Ngoài việc trả lại sai như Jason Cohen đã đề cập. Bạn cũng có thể phải ngăn chặn Lỗi

e.preventDefault();

Không biết có giúp được gì không, nhưng bạn có thể thử mô phỏng nhấp vào nút gửi, thay vì gửi trực tiếp biểu mẫu. Tôi có đoạn mã sau trong sản xuất và nó hoạt động tốt:

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

Lưu ý: jQuery ('# submit'). Focus () làm cho nút hoạt hình khi nhấn Enter.

Quay trở lại falseđể ngăn chặn tổ hợp phím tiếp tục.

Có bất kỳ lý do nào bạn phải móc và kiểm tra phím enter không?

Bạn không thể đơn giản thêm một

<input type="submit" /> 

vào mẫu của bạn và có tự nhiên được gửi khi nhập được đẩy không? Sau đó, bạn thậm chí có thể móc onsubmithành động của biểu mẫu và gọi hàm xác thực từ đó nếu bạn muốn ...

Bạn thậm chí có thể sử dụng onsubmitnhư một bài kiểm tra để xem nếu biểu mẫu của bạn đang được gửi, nhưng nó sẽ không hoạt động nếu bạn gọi form.submit().

Đây là một cách để làm điều này như một plugin JQuery (trong trường hợp bạn muốn sử dụng lại chức năng):

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

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

Bây giờ nếu bạn muốn trang trí một <input>yếu tố với loại chức năng này, nó đơn giản như thế này:

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

Bạn cũng có thể chỉ cần thêm onsubmit="return false"vào mã biểu mẫu trong trang để ngăn hành vi mặc định.

Sau đó móc ( .bindhoặc .live) submitsự kiện của biểu mẫu vào bất kỳ chức năng nào với jQuery trong tệp javascript.

Đây là một mã mẫu để giúp:

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()
    });
});

Điều này hoạt động kể từ 2011-04-13, với Firefox 4.0 và jQuery 1.4.3

Đây là mã của tôi:

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

Ngoài ra để duy trì khả năng truy cập, bạn nên sử dụng điều này để xác định mã khóa của mình:

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

if (c == 13) ...

Chỉ cần thêm để thực hiện dễ dàng. Bạn có thể chỉ cần tạo một biểu mẫu và sau đó ẩn nút gửi:

Ví dụ:

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

Tôi sử dụng bây giờ

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

Lúc đầu, tôi đã thêm một eventhandler vào nút gửi đã tạo ra lỗi cho tôi.

Hôm nay tôi phát hiện ra sự kiện nhấn phím không được kích hoạt khi nhấn phím Enter, vì vậy bạn có thể muốn chuyển sang keydown () hoặc keyup ().

Kịch bản thử nghiệm của tôi:

        $('.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;
            }
        });

Đầu ra trong bảng điều khiển khi gõ "A Enter B" trên bàn phím:

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

keydown (13)
enter
keyup (13)
enter

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

Bạn thấy trong chuỗi thứ hai, 'phím nhấn' bị thiếu, nhưng mã đăng ký phím và mã khóa '13' khi được nhấn / nhả. Theo tài liệu jQuery về chức năng nhấn phím () :

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.

Đã thử nghiệm trên IE11 và FF61 trên Máy chủ 2012 R2

Trong mã HTML:

<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>

Trong mã Js:

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
        }
    });
}

Thử cái này:

var form = document.formname;

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