Ответ 1

В jQuery будет работать следующее:

$("#id_of_textbox").keyup(function(event) {
    if (event.keyCode === 13) {
        $("#id_of_button").click();
    }
});

$("#pw").keyup(function(event) {
    if (event.keyCode === 13) {
        $("#myButton").click();
    }
});

$("#myButton").click(function() {
  alert("Button code executed.");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Username:<input id="username" type="text"><br>
Password:&nbsp;<input id="pw" type="password"><br>
<button id="myButton">Submit</button>

Ответ 2

Затем просто введите код!

<input type = "text"
       id = "txtSearch" 
       onkeydown = "if (event.keyCode == 13)
                        document.getElementById('btnSearch').click()"    
/>

<input type = "button"
       id = "btnSearch"
       value = "Search"
       onclick = "doSomething();"
/>

Ответ 3

Выяснил это:

<input type="text" id="txtSearch" onkeypress="return searchKeyPress(event);" />
<input type="button" id="btnSearch" Value="Search" onclick="doSomething();" />

<script>
function searchKeyPress(e)
{
    // look for window.event in case event isn't passed in
    e = e || window.event;
    if (e.keyCode == 13)
    {
        document.getElementById('btnSearch').click();
        return false;
    }
    return true;
}
</script>

Ответ 4

Сделайте кнопку элементом отправки, поэтому она будет автоматической.

<input type = "submit"
       id = "btnSearch"
       value = "Search"
       onclick = "return doSomething();"
/>

Обратите внимание, что для выполнения этой работы вам понадобится элемент <form>, содержащий поля ввода (спасибо Сергею Ильинскому).

Не рекомендуется переопределять стандартное поведение, клавиша Enter должна всегда вызывать кнопку отправки в форме.

Ответ 5

Поскольку никто еще не использовал addEventListener, вот моя версия. С учетом элементов:

<input type = "text" id = "txt" />
<input type = "button" id = "go" />

Я бы использовал следующее:

var go = document.getElementById("go");
var txt = document.getElementById("txt");

txt.addEventListener("keypress", function(event) {
    event.preventDefault();
    if (event.keyCode == 13)
        go.click();
});

Это позволяет вам изменять тип и действие события отдельно, сохраняя чистоту HTML.

Примечание, что, вероятно, стоит удостовериться, что это вне <form>, потому что, когда я вставлял эти элементы в них, нажав Enter, отправил форму и перезагрузил страницу. Принял несколько моментов, чтобы обнаружить.

Добавление. Благодаря комментарию от @ruffin, я добавил обработчик отсутствующего события и preventDefault, чтобы этот код (предположительно) работал внутри формы. (Я обернусь, чтобы проверить это, после чего я удалю содержимое в скобках.)

Ответ 6

В простом JavaScript,

if (document.layers) {
  document.captureEvents(Event.KEYDOWN);
}

document.onkeydown = function (evt) {
  var keyCode = evt ? (evt.which ? evt.which : evt.keyCode) : event.keyCode;
  if (keyCode == 13) {
    // For Enter.
    // Your function here.
  }
  if (keyCode == 27) {
    // For Escape.
    // Your function here.
  } else {
    return true;
  }
};

Я заметил, что ответ указан только в jQuery, поэтому я подумал о том, чтобы дать что-то в простом JavaScript.

Ответ 7

Один базовый трюк, который вы можете использовать для этого, которого я не видел полностью. Если вы хотите сделать ajax-действие или какую-либо другую работу над Enter, но не хотите, чтобы действительно отправить форму, вы можете сделать это:

<form onsubmit="Search();" action="javascript:void(0);">
    <input type="text" id="searchCriteria" placeholder="Search Criteria"/>
    <input type="button" onclick="Search();" value="Search" id="searchBtn"/>
</form>

Действие установки = "javascript: void (0);" например, это ярлык для предотвращения по умолчанию поведения по умолчанию. В этом случае вызывается метод, который вы нажимаете на кнопку ввода или нажимаете кнопку, и выполняется вызов ajax для загрузки некоторых данных.

Ответ 8

Попробуйте:

<input type="text" id="txtSearch"/>
<input type="button" id="btnSearch" Value="Search"/>

<script>             
   window.onload = function() {
     document.getElementById('txtSearch').onkeypress = function searchKeyPress(event) {
        if (event.keyCode == 13) {
            document.getElementById('btnSearch').click();
        }
    };

    document.getElementById('btnSearch').onclick =doSomething;
}
</script>

Ответ 9

Чтобы запускать поиск каждый раз при нажатии клавиши ввода, используйте это:

$(document).keypress(function(event) {
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if (keycode == '13') {
        $('#btnSearch').click();
    }
}

Ответ 10

onkeydown="javascript:if (event.which || event.keyCode){if ((event.which == 13) || (event.keyCode == 13)) {document.getElementById('btnSearch').click();}};"

Это что-то, что у меня есть из недавнего проекта... Я нашел его в сети, и я понятия не имею, есть ли лучший способ или нет в простом JavaScript.

Ответ 11

Хотя, я уверен, что до тех пор, пока в форме есть только одно поле и одна кнопка отправки, нажатие enter должно отправить форму, даже если на странице есть другая форма.

Затем вы можете захватить форму onsubmit с помощью js и выполнить любые проверки или обратные вызовы, которые вы хотите.

Ответ 12

Никто не заметил html attibute "accesskey", который доступен с тех пор.

Это не javascript способ создания сочетаний клавиш.

Сочетания клавиш атрибутов доступа на MDN

Намерен быть использованным как это. Достаточно самого атрибута html, однако мы можем изменить заполнитель или другой индикатор в зависимости от браузера и ОС. Сценарий - это непроверенный метод создания идеи. Вы можете использовать детектор библиотеки браузера, как крошечный Bowser

let client = navigator.userAgent.toLowerCase();
    isLinux = client.indexOf("linux") > -1;
    isWin = client.indexOf("windows") > -1;
    isMac = client.indexOf("apple") > -1;
    isFirefox = client.indexOf("firefox") > -1;
    isWebkit = client.indexOf("webkit") > -1;
    isOpera = client.indexOf("opera") > -1;
    input = document.getElementById('guestInput');

if(isFirefox) {
   input.setAttribute("placeholder", "Access keys: ALT+SHIFT+Z");
} else if (isWin) {
   input.setAttribute("placeholder", "Access keys: ALT+Z");
} else if (isMac) {
  input.setAttribute("placeholder", "Access keys: CTRL+ALT+Z");
} else if (isOpera) {
  input.setAttribute("placeholder", "Shortcut: SHIFT+ESCAPE->Z");
} else {'Point me to operate...'}

<input type="text" id="guestInput" accesskey="z" placeholder="Acces shortcut:"></input>

Ответ 13

Это решение для всех любителей YUI:

Y.on('keydown', function() {
  if(event.keyCode == 13){
    Y.one("#id_of_button").simulate("click");
  }
}, '#id_of_textbox');

В этом специальном случае у меня были лучшие результаты с использованием YUI для запуска объектов DOM, которые были введены функциональностью кнопок, но это еще одна история...

Ответ 14

В Angular2:

(keyup.enter)="doSomething()"

Если вам не нужна какая-то визуальная обратная связь в кнопке, это хороший дизайн, чтобы не ссылаться на кнопку, а скорее вызывать контроллер.

Кроме того, id не нужен - еще один способ NG2 для разделения между представлением и моделью.

Ответ 15

Эта попытка onchange закрыта, но неверно работает в отношении браузера, а затем вперед (в Safari 4.0.5 и Firefox 3.6.3), поэтому в конечном итоге я бы не рекомендовал его.

<input type="text" id="txtSearch" onchange="doSomething();" />
<input type="button" id="btnSearch" value="Search" onclick="doSomething();" />

Ответ 16

event.returnValue = false

Используйте его при обработке события или в функции, которую вызывает обработчик событий.

Он работает как минимум в Internet Explorer и Opera.

Ответ 17

Для jQuery mobile мне пришлось делать

$('#id_of_textbox').live("keyup", function(event) {
    if(event.keyCode == '13'){
    $('#id_of_button').click();
    }
});

Ответ 18

В этом случае вы также можете ввести disable кнопку ввода из Posting на сервер и выполнить Js script.

<input type="text" id="txtSearch" onkeydown="if (event.keyCode == 13)
 {document.getElementById('btnSearch').click(); return false;}"/>
<input type="button" id="btnSearch" value="Search" onclick="doSomething();" />

Ответ 19

Используйте keypress и event.key === "Enter" с современной JS!

const textbox = document.getElementById("txtSearch");
textbox.addEventListener("keypress", function onEvent(event) {
    if (event.key === "Enter") {
        document.getElementById("btnSearch").click();
    }
});

Mozilla Docs

Поддерживаемые браузеры

Ответ 20

Чтобы добавить полностью простое решение для JavaScript, адресованное проблеме @icedwater с отправкой формы, здесь представлено полное решение с form.

ПРИМЕЧАНИЕ: Это для "современных браузеров", включая IE9+. Версия IE8 не намного сложнее и может быть узнана здесь.

Fiddle: https://jsfiddle.net/rufwork/gm6h25th/1/

HTML

<body>
    <form>
        <input type="text" id="txt" />
        <input type="button" id="go" value="Click Me!" />
        <div id="outige"></div>
    </form>
</body>

JavaScript

// The document.addEventListener replicates $(document).ready() for
// modern browsers (including IE9+), and is slightly more robust than `onload`.
// More here: /questions/10685/what-is-the-non-jquery-equivalent-of-documentready/71469#71469
document.addEventListener("DOMContentLoaded", function() {
    var go = document.getElementById("go"),
        txt = document.getElementById("txt"),
        outige = document.getElementById("outige");

    // Note that jQuery handles "empty" selections "for free".
    // Since we're plain JavaScripting it, we need to make sure this DOM exists first.
    if (txt && go)    {
        txt.addEventListener("keypress", function (e) {
            if (event.keyCode === 13)   {
                go.click();
                e.preventDefault(); // <<< Most important missing piece from icedwater
            }
        });

        go.addEventListener("click", function () {
            if (outige) {
                outige.innerHTML += "Clicked!<br />";
            }
        });
    }
});

Ответ 21

document.onkeypress = function (e) {
 e = e || window.event;
 var charCode = (typeof e.which == "number") ? e.which : e.keyCode;
 if (charCode == 13) {

        // Do something here
        printResult();
    }
};

Вот мои два цента. Я работаю над приложением для Windows 8 и хочу, чтобы кнопка зарегистрировала событие щелчка, когда я нажимаю кнопку "Enter". Я делаю это в JS. Я попробовал пару предложений, но имел проблемы. Это работает отлично.

Ответ 22

Чтобы сделать это с помощью jQuery:

$("#txtSearch").on("keyup", function (event) {
    if (event.keyCode==13) {
        $("#btnSearch").get(0).click();
    }
});

Сделать это с помощью обычного JavaScript:

document.getElementById("txtSearch").addEventListener("keyup", function (event) {
    if (event.keyCode==13) { 
        document.getElementById("#btnSearch").click();
    }
});

Ответ 23

Для тех, кому может понравиться краткость и современный подход.

input.addEventListener('keydown', (e) => {if (e.keyCode == 13) doSomething()});

где input - это переменная, содержащая ваш элемент ввода.

Ответ 24

В jQuery вы можете использовать event.which==13. Если у вас есть form, вы можете использовать $('#formid').submit() (с правильными слушателями событий, добавленными к $('#formid').submit() указанной формы).

$('#textfield').keyup(function(event){
   if(event.which==13){
       $('#submit').click();
   }
});
$('#submit').click(function(e){
   if($('#textfield').val().trim().length){
      alert("Submitted!");
   } else {
    alert("Field can not be empty!");
   }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="textfield">
Enter Text:</label>
<input id="textfield" type="text">
<button id="submit">
Submit
</button>

Ответ 25

В современном, не обновленном (без keyCode или onkeydown) Javascript:

<input onkeypress="if(event.key == 'Enter') {console.log('Test')}">

Ответ 26

Это также может помочь, небольшая функция JavaScript, которая отлично работает:

<script type="text/javascript">
function blank(a) { if(a.value == a.defaultValue) a.value = ""; }

function unblank(a) { if(a.value == "") a.value = a.defaultValue; }
</script> 
<input type="text" value="email goes here" onfocus="blank(this)" onblur="unblank(this)" />

Я знаю, что этот вопрос решен, но я только что нашел что-то, что может быть полезно для других.