淘汰赛 - 获得点击的元素

Question

我有以下标记:

<fieldset>
   <div>
       <label class="editor-label">Question 1?</label>
       <input type="text" class="editor-field" />     
       <button type="button" data-bind="click: helpClicked">Help</button>
       <p class="help">Help 3</p>
   </div>
    <div>
       <label class="editor-label">Question 2?</label>
       <input type="text" class="editor-field" />
       <button type="button" data-bind="click: helpClicked">Help</button>
       <p class="help">Help 3</p>
   </div>
   <div>
       <label class="editor-label">Question 3?</label>
       <input type="text" class="editor-field" />
        <button type="button" data-bind="click: helpClicked">Help</button>
       <p class="help">Help 3</p>
   </div>
</fieldset>

我想切换<p>与类的可见性,与单击的按钮help相同Div.我试图使用$(this)来确定单击了哪个按钮然后我可以从那里获得正确的"帮助"元素.

问题是$(this)没有返回单击的按钮.

目前我试图简单地隐藏点击的按钮,如:

var viewModel = {
    helpClicked: function () {
        $(this).hide();           
    }
};

ko.applyBindings(viewModel);

这不起作用.有人可以帮忙吗？

Answer 1

这是一个jsFiddle,有一个可能的解决方案:

http://jsfiddle.net/unklefolk/399MF/1/

您可以通过以下语法定位所需的DOM元素:

var viewModel = {     
    helpClicked: function (item, event) {   
        $(event.target).hide(); 
        $(event.target).next(".help").show()            
    } 
};  
ko.applyBindings(viewModel); ?

Answer 2

尝试使用event.currentTarget后跟next()

$(event.currentTarget).next().hide();   

这里的工作示例