如何从可观察对象中获取有界元素DOM

时间:2015-05-04 16:56:08

标签: javascript jquery knockout.js

我需要从一个可观察对象中获取Element DOM。 请看这个例子。

我点击按钮"获取课程" ,然后我想获得 valueB DOM元素。

请注意我想要valueB DOM元素而不是buttonA

实施例

HTML

<button id="buttonA" data-bind="event:{click: getClassFromValueB}">Get Class</button>
<input id="valueB" class="Hello" data-bind="value: observables.idNumber"/>

视图模型

"
"
"
observables : {
    idNumber: ko.observable('SomeText');
},

getClassFromValueB : function(child, event){
    idNumber_DOM = this.getElementDOM(this.observables.idNumber);
},

getElementDOM : function(observable){
    **//WHAT TO DO HERE????**
}
"
"
"

我在没有jQuery的情况下寻求解决方案......

$(event.target).closest('#valueB')

更新:此问题的主要原因是当其他输入之一发生更改时清除输入中的自定义属性 例如:

<input id="InputA" class="Hello" data-bind="event:{change: clearInputB}"/>
<input id="InputB" class="Hello" data-bind="value: observables.idNumber"/>
<input id="InputC" class="Hello" data-bind="event:{change: clearInputB}"/>
<input id="InputD" class="Hello" data-bind="event:{change: clearInputB}"/>

1 个答案:

答案 0 :(得分:0)

不完全是你要求的,但也许你可以用不同的方式解决问题。如果您在DOM元素的类之后,Knockout会提供css binding。 valueB的数据绑定语句如下所示:

valueBClass = ko.observable('Hello');

getClassFromValueB = function() {
    var theClass = observables.valueBClass();
}

然后你可以有另一个可观察的名为valueBClass,你可以在其中设置valueB&#39的类以及从其他observable中检索它。

{{1}}

您正确地将DOM和模型分开。这是使用Knockout时有时会遗漏的重要概念。由于将它们分开,您不会在Knockout模型中的任何位置引用任何DOM元素。你只会参考observables。