Question

我有搜索区域工作正常，因为我需要它但问题是当我点击输入它不会搜索结果，所以你需要按下按钮才能这样做。我尝试了不同的代码，但没有任何工作，我想知道是否有人有解决方案。这是我的代码：

<input 
 data-path=".title" 
 data-button="#title-search-button"
 type="text"
 value=""
 placeholder="Search..."
 data-control-type="textbox"
 data-control-name="title-filter"
 data-control-action="filter"
/>

我想这可能适用于“onkeydown =”，但不能确定在它之后添加什么。

如果有人为此提供解决方案，我将非常感激。

Answer 1

虽然您可以使用onkeydown属性，但我更喜欢通过JavaScript事件监听器来执行这些操作。处理程序。 如果您想使用onkeydown属性执行此操作，请查看Bryan的答案。

我首先会在输入中添加ID / Class名称，以便我们轻松定位它。在我的示例中，我将添加searchText作为此输入的ID。

JavaScript的：

document.getElementById('searchText').addEventListener("keydown",function(e){
  if(e.keyCode == 13){
   //doSomething()
  } 
});

jQuery的：

$('#searchText').on('keydown',function(e){
  if(e.which == '13'){
    //doSomething();
  } 
});

Answer 2

是的，这适用于keydown。但是你需要添加javascript才能工作。

<input 
    data-path=".title" 
    data-button="#title-search-button"
    type="text"
    value=""
    placeholder="Search..."
    data-control-type="textbox"
    data-control-name="title-filter"
    data-control-action="filter"
    onkeydown="if (event.keyCode == 13) { // Your search results code here;
    return false; }"
/>

Answer 3

您必须为输入字段添加keyup的事件侦听器。 e.keyCode将为您提供特殊键（输入时恰好为13）

以下是一个例子：

$("#myinput").on('keyup', function (e) {
    if (e.keyCode == 13) {
        alert("Enter clicked");
        // add your code here
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input 
            id = "myinput"
            data-path=".title" 
            data-button="#title-search-button"
            type="text"
            value=""
            placeholder="Search..."
            data-control-type="textbox"
            data-control-name="title-filter"
            data-control-action="filter"
        />

希望这有帮助！

Answer 4

我使用计划javascript给出了下面的示例代码。此解决方案无需jquery或其他库即可使用。

在按键事件中，您可以调用点击事件的相同方法（或）按照下面提到的option 1和option 2直接触发按钮点击。

function triggerSearch() {
  if(event.keyCode === 13) {
    // Option 1: You can call the 'search' method directly
    //search();
    // Option 2: OR you can trigger the button `click` event
    getElement('searchButton').click();
  } 
}

function search() {
  var searchTerm = getElement('searchTextBox').value;
  getElement('searchTerm').innerHTML = searchTerm;
}

function getElement(id) {
  return document.getElementById(id);
}

<input 
            data-path=".title" 
            data-button="#title-search-button"
            type="text"
            value=""
            placeholder="Search..."
            data-control-type="textbox"
            data-control-name="title-filter"
            data-control-action="filter"
            id="searchTextBox"
            onkeydown="triggerSearch()"
        />

<input type="button" value="Search" id="searchButton" onclick="search()" />
<br/><br/>
Search Term: <span id="searchTerm"></span>

按Enter键时如何触发点击事件？文字区域

4 个答案: