Javascript 带有添加的关闭选项的引导弹出窗口也提交表单

Javascript 带有添加的关闭选项的引导弹出窗口也提交表单,javascript,jquery,html,css,twitter-bootstrap,Javascript,Jquery,Html,Css,Twitter Bootstrap,正如你在这里看到的,我有一个Boostrap Popover,可以通过外部点击和点击“x”来关闭 但是,当此popover放置在表单中时,它也会提交表单 有没有一种方法可以在单击后不提交表单而获得此可关闭popover的功能 HTML: <form action="quote-calculator.php" method="post"> <div class="bs-docs-example" style="padding-bottom: 24px;">

正如你在这里看到的,我有一个Boostrap Popover,可以通过外部点击和点击“x”来关闭

但是,当此popover放置在表单中时,它也会提交表单

有没有一种方法可以在单击后不提交表单而获得此可关闭popover的功能

HTML:

<form action="quote-calculator.php" method="post">
    <div class="bs-docs-example" style="padding-bottom: 24px;">
      <a href="#" class="more-info btn btn-large btn-danger" data-toggle="popover" data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
    </div>
</form>

jQuery:

        var isVisible = false;
        var clickedAway = false;

        $('.btn-danger').popover({
                html: true,
                trigger: 'manual'
            }).click(function(e) {
                $(this).popover('show');
            $('.popover-content').append('<button class="close" style="position: absolute; top: 0; right: 6px;">&times;</button>');
                clickedAway = false
                isVisible = true
                e.preventDefault()
            });

        $(document).click(function(e) {
          if(isVisible & clickedAway)
          {
            $('.btn-danger').popover('hide')
            isVisible = clickedAway = false
          }
          else
          {
            clickedAway = true
          }
        });
var isVisible=false;
var clickedAway=false;
$('.btn-danger').popover({
是的,
触发器:“手动”
})。单击(功能(e){
$(this.popover('show');
$('.popover content')。追加('×;');
ClickedWay=false
isVisible=true
e、 预防默认值()
});
$(文档)。单击(函数(e){
如果(可见并单击路径)
{
$('.btn danger').popover('hide'))
isVisible=ClickedWay=false
}
其他的
{
ClickedWay=true
}
});

您需要在此处添加
preventDefault()

        $(document).click(function(e) {
          if(isVisible & clickedAway)
          {
            $('.btn-danger').popover('hide')
            isVisible = clickedAway = false
            e.preventDefault()
          }
          else
          {
            clickedAway = true
          }
        });

将按钮元素更改为锚元素

$('.popover content').append('×;');
ClickedWay=false
isVisible=true
e、 预防默认值()
});

是否更改将其关闭到锚点的按钮?酷,我会加上它作为答案。这比改变“我喜欢简单的答案”更可取吗。非常感谢。
$('.popover-content').append('<a class="close" style="position: absolute; top: 0; right: 6px;">&times;</a>');
                    clickedAway = false
                    isVisible = true
                    e.preventDefault()
                });