Question

我想把社交＆＃39;喜欢＆＃39;按钮（fb，如推文等）在引导对话框中（modal-body内），所以我放了<script>标签。

<div  style='display: none;' modal="shouldBeOpen" close="close()" options="opts">
    <div class="modal-header">
        <h3 class="modal-title">Modal title</h3>
        <button class="close" ng-click="close()" data-dismiss="modal">×</button>
    </div>
    <div class="modal-body">
        <table border="0" width="100%" cellspacing="0" cellpadding="0">
            <tr>
                <td>
                <!-- facebook -->
                <div id="fb-root"></div>
                <script>(function(d, s, id) {
                  var js, fjs = d.getElementsByTagName(s)[0];
                  if (d.getElementById(id)) return;
                  js = d.createElement(s); js.id = id;
                  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=228306107317368";
                  fjs.parentNode.insertBefore(js, fjs);
                }(document, 'script', 'facebook-jssdk'));</script>

                <div class="fb-like" data-href="https://www.facebook.com/CVsIntellect" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-layout="box_count" data-action="like" data-show-faces="false" data-send="false"></div>

                </td>
                <td>

                <!-- twitter -->
                <a href="https://twitter.com/share" class="twitter-share-button" data-url="https://www.cvsintellect.com" data-text="CVsIntellect - The best free online Resume Builder. Uses LaTeX to create your CV!" data-via="CVsIntellect" data-count="vertical">Tweet</a>
                <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

                </td>


            </tr>

        </table>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
    </div>
</div>

但它没有在浏览器中显示该对话框中的任何内容。我错过了一些特别的东西吗？

Answer 1

Bootstrap Modals只是隐藏div s

放在模态中的脚本不是在页面加载时执行，而是在打开时执行。如果要在打开模态时在JavaScript中触发某些内容，请使用：

$('#myModal').on('shown.bs.modal', function (e) {
    // do whatever you want...
})

Bootstrap对话框没有在其中执行JavaScript代码

1 个答案: