1

同じ入力ボックスを動的に数回作成します。ユーザーが Enter キーを押すと、関数が呼び出されます。次に、次のコードでテストします。

function insertComment(){
  alert($(this).attr('id'));
}

しかし、未定義を返し続けます。同様の入力ボックスを作成するために使用する構文は次のとおりです。

$("#divToAppend").append("<input id='testID' type = 'text' class = 'formatCSS' style = 'margin-top:12px ; ' placeholder = 'Add Comment' onkeydown='if (event.keyCode == 13) insertComment()'></input>");
4

4 に答える 4

7

メソッドを呼び出すときにこれを渡すだけです：

$("#divToAppend").append("<input id='testID' type = 'text' class = 'formatCSS' style = 'margin-top:12px ; ' placeholder = 'Add Comment' onkeydown='if (event.keyCode == 13) insertComment(this)'></input>");


function insertComment(this)
{ 
alert($(this).attr('id')); 
}
于 2013-10-10T16:03:42.493 に答える
1

に注意してくださいthis。これはクレイジーな変数であり、コードに追加する前に常によく考えてください。

デバッグする前に、最初のレッスンは -

  • すべての関数は常にコンテキストで呼び出され、コンテキストがわからない場合はwindowオブジェクトです。

ここで何が起こっているのかを分析してみましょう。

ユーザーが入力フィールドでキーを押すと、insertCommentが呼び出されます。コンテキストがないため、ウィンドウ コンテキストで呼び出されます。したがって、関数内では、 yourthisは実際には を指しており、何も定義されwindowていません。window.attr('id')

window.insertCommentwhereを呼び出すのと同じthis == windowです。

コードを次のように変更すると、

onkeydown='if (event.keyCode == 13) insertComment(this)'

function insertComment(x){
    alert(x.attributes.id);
}

ここでは、コンテキストは引き続き ですwindow。つまり、this変数は引き続きwindowオブジェクトを指しますが、input要素自体はパラメーターとして関数に渡されますinsertComment。

x要素を参照し、id古き良きJavaScriptの方法で属性を取得できるようになりました-x.attributes.id

（または、必要に応じてjQueryの方法で- $(x).attr('id')）

于 2013-10-10T16:13:32.307 に答える