0

Font-awesome を使用して、チェックボックスを表示し、クリックしたときに何らかのアクションを実行する単純な JavaScript を作成しようとしています。これは私がこれまでに持っているものです:

      var check = document.createElement('i');
      check.className = 'icon-check-empty';
      check.type = 'checkbox';
      check.id = 'hideConfigCheck';

// クリック時のアクション (アラートとトグル チェックボックスのチェック)

      $('#hideConfigCheck').click(function () {
        alert('you clicked here');
        if($(this).hasClass('icon-check')){
            $(this).removeClass('icon-check').addClass('icon-check-empty');}
        else {
            $(this).removeClass('icon-check-empty').addClass('icon-check');}
    });

ただし、チェックボックスをクリックしても何も起こらないようです。提案？

4

2 に答える 2

2

一番上で宣言している要素はまだ DOM にない可能性が高いため、.click() 関数をバインドするときにバインドするものは何もありません。要素を追加するときにバインドを行う必要があります。 DOM

document.createElement は実際に要素をページに配置するのではなく、要素を作成して使用できるようにし、後でレンダリングします。それをレンダリングする何かが必要です。

最も簡単な方法は、本体 (または使用している場所) に追加することです。JQuery を使用している場合は、次のようにします。

$("body").append(check);

それを 2 つのコード ブロックの間に挿入すると、すべてが機能するはずです (私の場合はそうでした)。または、独自のセレクターの「本体」を切り替えます。

これが私の意味を示すフィドルです：http://jsfiddle.net/kcuMU/1/

ハッピーコーディング::

于 2013-06-19T23:18:12.930 に答える