jQuery append onclick関数が機能しません

Question

私は追加機能に問題があります。 このコードは正しく動作しません。

$(element).append("<a onclick='test('test')'> <i class='fa fa-spin fa-pencil' aria-hidden='true'></i></a>"); 

テスト機能：

function test(value) 
{ 
alert(value); 
} 

は、私はこの問題はonclickの機能に関連していると思われます。

Answer 1

代わりに '引用符を使用'

ここでjsbinを作成しました。 IIは、これはあなたがあなたが内部のアポストロフィをエスケープする必要があり

http://jsbin.com/wicanok/edit?html,js,output

$('#element').append("<a onclick='test(`test`)'> <i class='fa fa-spin fa-pencil' aria-hidden='true'>Hi</i></a>"); 

Answer 2

をやろうとしているものであると思います：

$(element).append("<a onclick='test(\"test\")'> <i class='fa fa-spin fa-pencil' aria-hidden='true'></i></a>"); 

そして確かtest()がの準備ができてグローバルに定義された（内部でない文書であることを確認してください例）。ここで

は一例です：

window.test = function(value){ 
 
\t alert(value); 
 
}; 
 
$('div').append("<a onclick='test(\"test\")'>click me</a>");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div></div>

Answer 3

コメントで示唆したように、あなたはあなたのような文字列の巣同様の引用符が現在行っていることはできません。あなたはバックスラッシュでエスケープする必要があります：

function test(value) { 
 
alert(value); 
 
} 
 

 
var element = $('body'); 
 

 
$(element).append("<a onclick='test(\"test\")'> <i class='fa fa-spin fa-pencil' aria-hidden='true'></i>Click Me</a>");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 4

あなたは（event delegationを使用して、完全にそのインラインJSを取り出し、イベントリスナーを追加するためにjQueryを使用して方がいいでしょう、あなたが追加しているので、 DOMへの新しい要素）。

$(element).append('<a class="test">...'); 

$(document).on('click', '.test', function() { 
    test('test'); 
});