jQuery事件未綁定到剔除條件元素

Question

我有一個簡單的loggedIn屬性，它是一個作為布爾值的ko綁定，因此當一個人登錄（檢查帶有異步xhr以確認服務器端的檢查）時，應在標頭中顯示一個元素：

<!-- ko if: loggedIn -->
<div class="loggedin">
  <a class="logout">Log Out</a>
</div>
<!-- /ko -->

<!-- ko ifnot: loggedIn -->
<div class="loggedout">
  <a class="login">Log In</a>
  <a class="signup">Signup</a>
</div>
<!-- /ko -->

上面是從顯示/隱藏角度進行的工作，即，如果loggedIn為true則顯示“ Log Out鏈接。

我.on的問題是將jQuery綁定到元素，即使使用.on ：

$('.loggedin').on('click', '.logout', function () {
   // Never fires...
});

如果刷新頁面，它將起作用，但是任何動態更改都使我無法綁定到click（或任何其他）事件。

更新：我創建了一個小提琴來顯示問題

Answer 1

做到這一點的一種好方法是在您的vm中擁有一個可以完成工作的函數，而不是依賴於jquery事件。 然后將click事件綁定到您的函數。

<div class="loggedout" data-bind="click: someVMFunction">
<a class="login">Log In</a>
<a class="signup">Signup</a>
</div>

Answer 2

我發現的解決方案是使用ko的visible ：

<div class="loggedin" data-bind="visible: loggedIn()">
   <a class="logout">Log Out</a>
</div>

<div class="loggedout" data-bind="visible: !loggedIn()">
   <a class="login">Log In</a>
   <a class="signup">Signup</a>
</div>

這似乎完美地工作，允許jQuery毫無問題地綁定元素。