gpt4 book ai didi

javascript - Bootstrap Popover Inside Popover 不起作用

转载 作者:塔克拉玛干 更新时间:2023-11-02 09:26:00 26 4
gpt4 key购买 nike

我正在使用 twitter bootstrap 在社交媒体上分享我的帖子,我创建了一个链接,其弹出窗口带有一些按钮内容,但是当我进一步点击弹出窗口中的按钮时,它们的弹出窗口功能不起作用。

<div class="well text-center">
<button id="but1" title='Popover' class="btn btn-success" rel='popover' data-placement="bottom" data-toggle='popover2'>Share</button>
</div>

<div class='container hide' id='cont'>
<a onclick="Facebook()"
class="btn btn-default">
Facebook
</a>
<a onclick="twitter()"
class="btn btn-default">
Twitter
</a>
<a class="btn btn-default"
data-placement="bottom" data-toggle="popover" data-title="Login" data-container="body"
type="button" data-html="true" href="#" id="login">
Email
</a>
</div>

<div id="popover-content" class="hide">
<form class="form-inline" role="form">
<div class="form-group">
<input type="text" placeholder="Name" class="form-control" maxlength="5">
<button type="submit" class="btn btn-primary" onclick="EmailToSomeOne();">Send</button>
</div>
</form>
</div>

和 js

$('#but1').popover({
html: true,
content: $('#cont').html()
});


$("[data-toggle=popover]").popover({
html: true,
content: function() {
return $('#popover-content').html();
}
});

function Facebook(){
alert('share on facebook');
}
function twitter(){
alert('share on twitter');
}

function EmailToSomeOne(){
alert('Email to send');
}

为了更多的清理,我创建了一个 fiddle还有。

最佳答案

您的代码运行良好。这只是一个 jsFiddle 设置问题。

在你的 fiddle 中,在左侧的下拉列表中选择 no wrap (head),单击 Run,它将起作用。

See example

选择Onload时,您的功能是在$(document).ready(function(){})的关闭中定义的。仅有的。这就是它显示错误 Uncaught ReferenceError: Facebook is not defined 的原因(查看控制台)

顺便说一句,这是 plunkr 上的等效示例 enter link description here

关于javascript - Bootstrap Popover Inside Popover 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30953570/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com