JQueryがポップオーバー内のブートストラップボタンのために機能しません

Question

ブートストラップポップオーバーの中でAJAXコールを実行しようとしていて、何か問題があります。

PHP：

$my-data-content = '<div><form> 
<select class="form-control"> 
<option value="Enable">Enable</option> 
<option value="Disable">Disable</option> 
</select><button id="pl-op-fetch" type="submit" class="btn btn-info"> 
Save Changes</button></form></div>'; 

HTML：

<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" 
data-content='<?php echo $my-data-content; ?>' data-html="true"> 

Javascriptを：

jQuery(document).ready(function($){ 
$('#pl-op-fetch').click(function(e){ 
    e.preventDefault(); 
}); 
}); 

私の問題として、ボタンpl-op-fetchがクリックされた場合、e.preventDefault()は機能していません（と私が最小限に抑えた後続のAJAX呼び出し）。 クリックすると、ボタンが私のホームページにリダイレクトされます。 私のページには、AJAXコールを正常に使用する他の要素があり、ボタンをクリックしたときにそのボタンのデフォルトアクションが実行されないようにしていますが、これをブートストラップポップオーバーに取り掛かる際に問題に遭遇しています。

誰もが考えている？

Answer 1

ページが読み込まあなたはそれが要素

として発見されることはありません属性の文字列として 「イベント委譲」

を使用する必要があるので、その要素がDOMに存在しません。

$(document).on('click', '#pl-op-fetch',function(e){ 
    e.preventDefault(); 
});