Question

当用户点击按钮时，Knockout执行Javascript时遇到问题。不幸的是，这是一个非常复杂的页面，我无法显示完整的内容，但希望下面的小片段足够了。

我试图通过在data-bind的Knockout绑定中调用实际的视图模型来简化这一点，而只是简单地提醒。

<div data-bind="foreach: MyComputedStuff()">
...
  <div class="popover-content">
    <button onclick="alert('bar')">
      This works!
    </button>
    <button data-bind="click: function(data, event){alert('foo')}">
      THIS DOES NOT WORK
    </button>
  </div>
...
</div>

有什么明显的事我在这里做错了吗？

为什么alert('foo')无法执行？

知道我们使用Bootstrap并且此特定按钮位于popover div内可能会有所帮助。

修改

我在控制台中看不到任何内容，页面的其余部分Javascript继续正常工作。我在Chrome和IE9中试过这个。

我应该说我能够将同一foreach内另一个元素上的click事件绑定到视图模型中的一个函数。这是有效的，这是我期望能够复制的。（如果我用alert('blah')替换对函数的调用，那么我在这里看到预期的警告。）那么为什么不在我的按钮上？

<a rel="tooltip" 
  title="Favourite App"
  data-bind="click: function(data, event){$root.ToggleFavorite(data)}">

Answer 1

感谢haim770，Alexander，UweB和mhu的帮助。

一位同事指出了Knockout没有绑定click事件的原因： Bootstrap正在修改DOM。

通过使用Knockout context debugger Chrome扩展程序，我的同事指出包含我的按钮的div元素不在我告诉Knockout应用绑定的区域内...... Bootstrap移动了它。

我正在使用Bootstrap的popovers功能，而我的按钮位于 popover 中，Bootstrap移出了我foreach的div。

Knockout：使用Bootstrap popover时无法绑定到按钮的click事件

1 个答案: