javascript - クリックイベントでdivを無効にする

Question

イベントが呼び出さない画像とクリックイベントでdivを無効にしたい。私はKOでそれをやろうとします:

<div title="Delete Series" class="deleteSeriesButton" data-bind="css: { disabled: true}" ></div>

しかし、これはdivでは機能しません。

クリックイベントのバインドを解除せずに実行できますか?

Answer 1

KnockoutJS を使用している場合は、ビュー モデルがあります。また、ビューモデルがある場合は、「シリーズの削除」ボタンが有効か無効かを示す監視可能なプロパティを追加できるはずです。

self.isDeleteEnabled = ko.computed(function() {
    // your code that tells whether the button is enabled or not
});

そして、あなたのビューモデルで、次のようなクリックアクションがあるとしましょう:

self.clickAction = function() { 
    // do what you want to do 
}

次に、次のように、このオブザーバブルに依存する「クリック」バインディングを作成できます。

<div class="button" data-bind="click: isDeleteEnabled() ? clickAction : null">

isDeleteEnabled オブザーバブルが true を返す場合、ボタンはクリック可能ですが、そうでない場合はクリックできません。

実際の例でどのように行われるかを確認できるように、フィドルを作成しました。