如何在用户按下输入时使搜索工作

Question

这是按钮创建的按钮，当用户单击搜索选项卡时，该按钮具有可进入页面的功能，但我需要它在用户压力机也进入。

这是搜索栏和按钮

<input type="text" method="get" class="form-control" id="search" placeholder="Search" value=""> 
<button type="button" id="go" class="btn btn-default" onclick="sendToPage();">Search</button> 

这是函数

function sendToPage(){ 
    var input = document.getElementById("search").value; 

    //Check to see if the user has entered apple/iphone; 
    if (input === "apple"){ 
     //location.href="apple.html";      
     location.replace("apple.html"); 
     return false; 
    } 
    else if (input === "iphone"){ 
     location.replace("apple.html"); 
     return false; 
    } 
} 

Answer 1

您可以添加keyup，检查其event.keyCode。如果键码是13，则表示用户在输入文本上单击了输入。

事情是这样的：

document.getElementById("search") 
    .addEventListener("keyup", function(event) { 
    event.preventDefault(); 
    if (event.keyCode == 13) { 
     if (input === "apple")    
      location.replace("apple.html"); 
     else if (input === "iphone") 
      location.replace("apple.html"); 
    } 
    return false; 
}); 

或使用功能sendToPage()：

document.getElementById("search") 
    .addEventListener("keyup", function(event) { 
    event.preventDefault(); 
    sendToPage(); 
    return false; 
}); 

Answer 2

This is the button 

<!-This is the button --> 
<div id="search-bar"> 
<div class="form-group"> 
    <input type="text" method="get" class="form-control" id="search" placeholder="Search" value=""> 
    <button type="button" id="go" class="btn btn-default" onclick="sendToPage();" onChange="aliasonclick">Search</button> 
</div> 
</div> 

Answer 3

看来你输入字段的ID是 '搜索'，所以你可以试试这个： 请注意，输入的键码是13.因此我们可以将输入的码与13进行比较。如果它的真实，那么进行搜索。

$('#search').keydown(function(event) { 
    if (event.keyCode == 13) { 
     var input = $(this).val(); 
     if (input === "apple"){ 
      //location.href="apple.html";      
       location.replace("apple.html"); 
       return false; 
     } 
     else if (input === "iphone"){ 
       location.replace("apple.html"); 
       return false; 
     } 
     return false; 
    } 
    }); 

}); 

Answer 4

在输入周围放置一个表格应该会给你你要找的结果。然后，只需在调用sendToPage（）的窗体中添加一个“onsubmit”;功能。