按下回车键时获取输入文本的值

Question

我正在尝试这个：

<input type="text" placeholder="some text" class="search" onkeydown="search()"/>
<input type="text" placeholder="some text" class="search" onkeydown="search()"/>

用一些javascript来检查是否按下了回车键：

function search() {
    if(event.keyCode == 13) {
        alert("should get the innerHTML or text value here");
    }
}

目前工作正常，但我的问题是如何获取文本字段内的值，我正在考虑将引用“this”传递给函数，或者如果它们有 id，那么我可以使用 ID，但后来我不这样做不知道如何区分已输入的内容，让我再次回到同样的问题......

Answer 1

试试这个：

<input type="text" placeholder="some text" class="search" onkeydown="search(this)"/>  
<input type="text" placeholder="some text" class="search" onkeydown="search(this)"/>

JS代码

function search(ele) {
    if(event.key === 'Enter') {
        alert(ele.value);        
    }
}

演示链接

Answer 2

$("input").on("keydown",function search(e) {
    if(e.keyCode == 13) {
        alert($(this).val());
    }
});

jsFiddle 示例：http://jsfiddle.net/NH8K2/1/

Answer 3

仅使用事件对象

function search(e) {
    e = e || window.event;
    if(e.keyCode == 13) {
        var elem = e.srcElement || e.target;
        alert(elem.value);
    }
}

Answer 4

聆听

change

活动。

document.querySelector("input")
  .addEventListener('change', (e) => {
    console.log(e.currentTarget.value);
 });

Answer 5

    const $myInput = document.getElementById('myInput');

    $myInput.onkeydown = function(event){
        if(event.key === 'Enter') {
            alert($myInput.value);        
        }
    }

Answer 6

您不应该将 Javascript 代码放入 HTML 中，因为您为这些输入提供了一个类（“搜索”），所以没有理由这样做。更好的解决方案是做这样的事情：

$( '.search' ).on( 'keydown', function ( evt ) {
    if( evt.keyCode == 13 )
        search( $( this ).val() ); 
} ); 

Answer 7

类似这样的东西（未经测试，但应该有效）

将此作为 Html 中的参数传递：

<input type="text" placeholder="some text" class="search" onkeydown="search(this)"/>

并提醒传入搜索函数的参数值：

function search(e){
  alert(e.value);
}

Answer 8

  const searchInput =  document.getElementById('urlInput');

searchInput.addEventListener('keydown',(e)=>{
    console.log(e.key)
    if(e.key == 13){
        const elem =  e.target
        console.log(elem.value);
    }
})

<input id="urlInput" type="text" placeholder="some text" class="search"/>