Javascript 如何启动Fuel UX搜索功能

我想使用Fuel UX搜索控件。我设计了一个如下所示的表单来声明燃油搜索控制：

  <form class="navbar-form navbar-left" role="search">
    <div class="form-group">
      <div class="search input-group" role="search">
        <input type="search" id="searchprefix" class="form-control" type="text" placeholder="Search Prefix">
        <span class="input-group-btn">
          <button class="btn btn-default" type="button">
            <span class="glyphicon glyphicon-search"></span>
            <span class="sr-only">Search</span>
          </button>
        </span>
      </div>
    </div>
  </form>

---

搜索控件将按预期显示。但是，我不知道如何定义当用户在控件内键入search prefix并点击Enter时要调用的JavaScript函数。有人能给我看一个工作示例吗？

您需要定义一个监听器，在按下fuel ux文档中的搜索时会触发该监听器：

searched.fu.search-当用户在输入中按Enter键或单击按钮时触发此事件。 cleared.fu.search-当用户清除输入时触发此事件。 所有搜索事件都在.search classed元素上激发

例如：

Html代码：

<div class="search input-group" role="search" id="mySearch">
  <input type="search" class="form-control" placeholder="Search"/>
  <span class="input-group-btn">
    <button class="btn btn-default" type="button">
      <span class="glyphicon glyphicon-search"></span>
      <span class="sr-only">Search</span>
    </button>
  </span>
</div>

$('#mySearch').on('searched.fu.search', function(evt, data) {
    // data will then contain your search string .. in this place you have to place your search handler code
    alert(data);
});