敲除變量爲「true」時突出顯示文本？

Question

當用戶單擊頁面上給定元素的「編輯」時，我想突出顯示正在編輯的內容的文本，以便用戶不必單擊輸入區域。

我有以下幾點：

var ViewModel = function() { 
    var self = this; 
    self.title = ko.observable("title"); 
    self.editing = ko.observable(false); 
    if (self.editing()) { 
     // highlight text in DOM? 
    } 
}; 

ko.applyBindings(new ViewModel()); 

這裏的的jsfiddle： http://jsfiddle.net/PTSkR/85/

如何才能做到這一點？

Answer 1

在您的視圖中使用hasfocus綁定。一般來說，如果可能的話，任何視圖特定應該被保留在虛擬機之外，並且應該通過內置綁定或自定義綁定來處理。

<input class="title-input" data-bind="value: title, hasfocus: editing" 

更新您的提琴：http://jsfiddle.net/PTSkR/87/

更新： 選擇輸入文字可以使用自定義綁定來完成。別人已經回答瞭如何做到這一點： https://stackoverflow.com/a/12297619/2421292

Answer 2

CSS結合： -

<input class="title-input" data-bind="value: title, css: {HL : editing()}"/> 

CSS：

.HL { 
    background: #ffff99; 
    color: #000000; 
    }