ノックアウト JS ベースのクライアント側コメント システムを実装しています。ユーザーがテキストエリアをクリックして編集を有効にした瞬間にテキストエリアのスタイルを変更し、ユーザーがページの別の場所をクリック (クリックアウト) してテキストエリアを非アクティブにしたときに、テキストエリアのスタイルをデフォルトに戻す必要があります。
ノックアウトJSでこれらのイベントにバインドするにはどうすればよいですか?
ノックアウト JS ベースのクライアント側コメント システムを実装しています。ユーザーがテキストエリアをクリックして編集を有効にした瞬間にテキストエリアのスタイルを変更し、ユーザーがページの別の場所をクリック (クリックアウト) してテキストエリアを非アクティブにしたときに、テキストエリアのスタイルをデフォルトに戻す必要があります。
ノックアウトJSでこれらのイベントにバインドするにはどうすればよいですか?
バインディングを使用して、event
任意のイベントをキャプチャしたり、css
スタイル要素へのバインディングを使用したりできます。
focur /blurイベントを使用した簡単な例を次に示します。http://jsfiddle.net/antishok/KXhem/48/
2 つの異なる方法を示すフィドルをまとめました。http://jsfiddle.net/photo_tom/ckb9V/1/にあります。
1 つ目textarea
は、ノックアウトhasfocus
と CSS バインディングを使用してクラスを追加する方法を示しています。この例は、質問で要求したことを行う方法を示していると思います。これがどのように機能するかについての完全な説明は、http://knockoutjs.com/documentation/hasfocus-binding.html で確認できます。
2 番目のテキストエリアは、CSS だけでそれを行う方法を示しています。これに関する完全な説明は、「CSS/HTML: 入力フィールドの周りに光る境界線を作成する」で確認できます。