jquery似乎不能在bootstrap 4 popover中工作

问题描述 投票:0回答:1

我想通过jquery(jquery-3.2.1.min.js)和ajax从bootstrap popover内部发送数据。 popover运行正常,但我无法让提交工作。

我初始化了popover

$(document).ready(function() {

    $(function(){

        $("[data-toggle=popover]").popover({
            html : true,
            content: function() {
                var content = $(this).attr("data-popover-content");
                return $(content).children(".popover-body").html();
            },
            title: function() {
                var title = $(this).attr("data-popover-content");
                return $(title).children(".popover-heading").html();
            }
        });

    });
});

这是html触发器:

<span tabindex="0" role="button" data-toggle="popover" data-placement="right" data-popover-content="#comment230" data-original-title="" title="">
    <img src="/ds/img/comment.svg" alt="comment" height="16px">
</span>

这是popover中的html:

<div id="comment225" style="display:none;">
    <div class="popover-heading">Comments</div>
    <div class="popover-body">
        <div class="commentbody">
            <div>
                <fieldset>
                    <div class="input text">
                        <label for="comment">Comment</label>
                        <input name="comment" id="comment" type="text" />
                    </div>
                </fieldset>
                <button class="submittest" id="acomment225button">Test</button>
            </div>
        </div>
    </div>
</div>  

出于测试原因,我这样做了:

$(".submittest").click(function(e) {
    alert('test');
    e.preventDefault();
});

警报不适用于弹出框内的按钮,而是来自页面其余部分的按钮。我怎样才能让它发挥作用?

javascript jquery html
1个回答
2
投票

在您订阅活动时,这些DOM元素不存在。

您需要以这种方式连接事件:

$(document).on("click", ".submittest", function(e){
   alert("test");
});
© www.soinside.com 2019 - 2024. All rights reserved.