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绑定。一般来说，任何特定视图都应该尽可能地保留在VM之外，并且应该通过内置绑定或自定义绑定来处理。

<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;
    }

当敲除变量为“真”时突出显示文本？

2 个答案: