javascript - JavaScriptで動的に作成されたボタンにアクションを追加できません

Question

JavaScriptで動的に1つのボタンを作成しましたが、そのボタンのアクションを設定できません。

var but = document.createElement("input");
but.type = "button"
but.value = "NewButton";
but.onClick = check();
var newElement = document.getElementById("addButton"); //span element id
newElement.appendChild(but);

ボタンがクリックされたときに関数'check（）'は呼び出されません

Answer 1

コードに2つの問題があります。1つ目は、イベントが大文字になっていないことです。2つ目は、関数の結果ではなく、イベントを関数に割り当てたいことです。次のようになります。

but.onclick = check;

これにより、実際には、関数の期待される結果ではなく、関数のアドレスにイベントが割り当てられます（これは何もしません）。

Answer 2

check()関数を実行し、その関数が返すものをbut.onClickに割り当てます。関数をイベントに割り当てるには、名前で指定します（親は含まれません）。

Answer 3

あなたcheckの関数は、onclickイベントのコールバックとして割り当てるために必要な関数を返さないと思います。

but.onclick = check; 

たとえば、次の場合です。

var check = function() {   
     return function(){
        /* some logic eg. dependent of arguments 'parent' function' */  
    }  }
//works
but.onclick = check('somethingImportant');

addEventListener大丈夫ですが、これらのイベントに複数のコールバックを割り当てたい場合は問題があります:) /について知っているとよいでしょうattachEvent

but.addEventListener( 'click', check,true );
but.addEventListener( 'click', check2,true );

その後、必要に応じて機能を使用removeEventListerまたはdetachEvent切り離します。

ただし、jqueryで遊んでみてください:)

var check = function(){/* do something */};
        $('#addButton').append(
           $('<input type="button" value="New Button"/>') 
        ).click( check );​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

また

    $('#addButton').append( 
           $('<input/>' ).attr( 'type', 'button' ).val( 'New Button' ) )
                .click( function(){ /* do something */ } ) ​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    );

それから

$('#addButton').unbind(  'click' ) // unbind( 'click',check )  

そしてそれを行うことへのはるかに多くの可能性:)

Answer 4

小さなケースonclick：

but.onclick = check();