如何通过单击键盘按钮提交Web表单？

Question

<form action="page.php" method="post">
    <input type="text" name="some_text" />
    <input type="submit" name="some_submit" /
</form>

I want to submit this form by pressing defined keyboard button. I wonder how to do it. If it was just an <a> element it would be simple - I would just change window.location value after handling keypress event. But there is some data to send and I have no idea how to solve this.

Answer 1

由于form.submit（）的结果，数据将自动传递

Answer 2

You can create an event handler for a key press event, then submit the form using its submit() method to pass all the form data to the recipient page "page.php".

Using jQuery , this is trivial:

<form id="myForm" action="page.php" method="post">
    <input type="text" name="some_text" />
    <input type="submit" name="some_submit" />
</form>

<script type="text/javascript">

    $('#myForm").keyDown(function(e){

        if(e.which == 13) // When key pressed is "Enter" key.
            $('#myForm').submit();

    });

</script>

Read Javascript Madness: Keyboard Events for more information on interpreting keyboard events.

Answer 3

Give a name to the form

<form name="myform" action="page.php" method="post"> 

After handling key press event do

document.myform.submit()

which will basically submit the form. If you want to add more parameters to it add those as hidden elements inside form.

Answer 4

For an example of key press handling, see http://dev.kanngard.net/Permalinks/ID_20050426091851.html - it submits a form if key 13 (Enter) is pressed, but can be modified to any other key.

In general: register a function to be called on KeyDown event, inside the function, check which key was pressed; if needed, submit() your form.

Answer 5

I'm in trouble:

function action(button) {
if ($('a.'+button+':visible').length > 0) {
    if ($('a.'+button+':visible').attr('class') == button || $('a.'+button+':visible').attr('class') == 'rotate '+button) {
        var adr = $('a.'+button+':visible').attr('href');
        window.location = adr;
    }
    if ($('a.'+button+':visible').attr('class') != button) {
        $('a.'+button+':visible').click();
    }
}
    if ($('input.'+button+':visible').length > 0) {
        $('#form').submit();
    }
}

Where variable 'button' is button's classname and #form is form's id. By clicking submit it works normally, but it doesn't work by keyboard event.