Question

我无法将jQuery Mobile搜索输入文本“clear text button”与Knockout的hasFocus绑定一起使用。

我的目标是当用户搜索时，屏幕上的其他内容消失。但是，当用户不搜索时，其他内容是可见的。一切都很好，除了......

当我输入jQuery Mobile搜索输入并单击“X”清除输入时，搜索输入失去焦点，但输入未被清除。应该发生的是相反的（应该清除搜索输入并且搜索输入应该保持焦点）。

HTML

<div id="wrapper">
    <div data-role="content">
        <h3 data-bind="visible: !IsSearching()">I am some content</h3>
        <input type="search" data-bind="hasFocus: IsSearching" />
        <h3 data-bind="visible: !IsSearching()">I am some more content</h3>
    </div>    
</div>

的Javascript

$(function() {
    ko.applyBindings(new MyViewModel(), document.getElementById("wrapper"));
});

function MyViewModel() {
    this.IsSearching = ko.observable(false);
}

Answer 1

我能够解决这个问题。如果搜索文本没有聚焦且搜索文本长度为0，我就这样做只会隐藏页面上的其他元素。

如果有人遇到类似的问题，here是指向工作小提琴的链接。

以下是代码：

<强> HTML

<div id="wrapper">
    <div data-role="content">
        <h3 data-bind="visible: !IsSearching() && SearchText().length == 0">I am some content</h3>
        <input type="search" data-bind="value: SearchText, hasFocus: IsSearching" />
        <h3 data-bind="visible: !IsSearching() && SearchText().length == 0">I am some more content</h3>
    </div>    
</div>

<强>的Javascript

$(function() {
    ko.applyBindings(new MyViewModel(), document.getElementById("wrapper"));
});

function MyViewModel() {
    this.IsSearching = ko.observable(false);
    this.SearchText = ko.observable("");
}

使用Knockout hasFocus绑定清除jQuery Mobile搜索输入

1 个答案: