javascript - jQuery在Popover中对Bootstrap Button不起作用

我正在尝试在自举弹出窗口中运行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调用并阻止按钮在单击时执行其默认操作，但是在尝试将其处理为Bootstrap Pop-Over时遇到问题。

谁有想法？

最佳答案

页面加载时该元素在dom中不存在，因此您需要使用“事件委托”

作为属性中的字符串，不会将其作为元素

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