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

Question

我需要从可观察的对象获取元素dom。请在此示例上查看。

我要单击按钮" get class" ，然后我想获得 valueb dom element。

请注意我想要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"/>

ViewModel

"
"
"
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}"/>

Answer 1

不是您要的要求，但也许您可以以不同的方式解决问题。如果您追求DOM元素的类，敲除可以提供CSS绑定。ValueB的数据界语句看起来像这样：

<input id="valueB" data-bind="css: observables.valueBClass, value: observables.idNumber"/>

然后，您可以拥有另一个可观察的命名valueBClass，您可以在其中设置ValueB的类并从其他可观察物中检索。

valueBClass = ko.observable('Hello');
getClassFromValueB = function() {
    var theClass = observables.valueBClass();
}

您处在正确的轨道上，以使DOM和模型分开。这是一个重要的概念，有时在使用淘汰赛时会错过。由于将它们分开，因此您不会在敲除模型中任何地方引用任何DOM元素。您只会参考可观察。