jQuery移動搜索輸入通過Knockout hasFocus綁定清除

Question

我無法讓jQuery Mobile搜索輸入文本「清除文本按鈕」與Knockout的hasFocus綁定一起工作。

我的目標是，當用戶正在搜索時，屏幕上的其他內容會消失。但是，當用戶不搜索時，其他內容可見。一切正常，但...

當我在jQuery Mobile搜索輸入中輸入並單擊「X」以清除輸入時，搜索輸入失去焦點，但輸入未被清除。 應該發生的是相反的（搜索輸入應該被清除並且搜索輸入應該保持焦點）。

I've created a JSFiddle顯示我在說什麼。

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(""); 
}