knockout.js - jquery mobile 和 knockoutjs 输入类型搜索绑定问题

Question

我看到了一个关于 knockoutjs 和 jquery mobile 的奇怪问题，如果输入类型设置为搜索，则绑定失败，对于相同的代码，如果输入类型设置为文本，则绑定成功。有想法该怎么解决这个吗？

<form data-bind="jqmsubmit: search" >                   
  <input data-theme="b" name="search" id="search" type="search" data-bind="value: searchTerm"></input>
</form> 

当我在文本框中键入并按 Enter 时，使用上面的代码 searchTerm 不会更新。如果我将输入元素更改为 type="text" searchTerm 按预期更新。

Answer 1

输入type="search"不会触发change事件，而是触发serach事件。

所以你需要订阅search事件，你可以使用绑定的valueUpdate设置value

<form data-bind="jqmsubmit: search" >                   
  <input data-theme="b" name="search" id="search" type="search" 
         data-bind="value: searchTerm, valueUpdate: ['search']">  
  </input>
</form>

Answer 2

我遇到了同样的问题。我认为问题与 jQuery Mobile 如何用与文本输入元素略有不同的 HTML替换搜索输入元素有关。此解决方法对我有用：

<input type="search" 
       onkeyup="ko.contextFor(this).$data.searchTerm(this.value);"
       onchange="ko.contextFor(this).$data.searchTerm(this.value);"
       placeholder="Search" />