没有出现Twitter引导模式

时间:2022-04-05 10:38:56

Any modal that I am creating using twitter bootstrap fails to appear. I'm not sure what I'm doing wrong seeing that I set up a test modal using the code that bootstrap provides and it still doesn't work.

我使用twitter引导程序创建的任何模式都不会出现。我不确定我做错了什么,因为我使用bootstrap提供的代码设置了一个测试模式,但它仍然不起作用。

Here is my code (body only): You need to link to bootstrap.js, bootstrap-modal.js, jquery.js, and bootstrap.css

这是我的代码(正文):您需要链接到bootstrap。js,bootstrap-modal。js,jquery。js和bootstrap.css

<body>
    <div class="modal hide" id="myModal">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">
                &times;
            </button>
            <h3>Modal header</h3>
        </div>
        <div class="modal-body">
            <p>
                Modal body would go here...
            </p>
        </div>
        <div class="modal-footer">
            <a href="#" class="btn" data-dismiss="modal">Close</a>
            <a href="#" class="btn btn-primary">Save changes</a>
        </div>
    </div>

    <a data-toggle="modal" href="#myModal">Show Modal</a>
</body>

And here are links to the bootstrap package and jquery that a bootstrap modal needs: bootstrap package jquery

这里有指向引导包和jquery的链接,引导模式需要:引导包jquery

2 个解决方案

#1


5  

My problem was that I was including both boostrap.js and bootstrap-modal.js. Apparently if you include bootstrap.js you shouldn't also inlclude bootstrap-modal.js because boostrap.js imports all of the javascript plugins that it is compatible with. Something like that. After deleting my boostrap-modal.js script link it worked.

我的问题是我把这两款boostrap都包括进去了。js和bootstrap-modal.js。显然,如果你包含引导。js你也不应该加入bootstrap-modal。因为boostrap js。js导入它兼容的所有javascript插件。就像这样。我boostrap-modal后删除。js脚本链接起作用了。

#2


4  

You have to call:

你必须调用:

<script>
   $('#myModal').modal('show')
</script>

After the </body> tag. Or if you only want to call it when the user clicks on something:

< /身体>标记。或者,如果你只想在用户点击某样东西时调用它:

$('#button_id').click(function(){
    $('#myModal').modal('show')
});

#1


5  

My problem was that I was including both boostrap.js and bootstrap-modal.js. Apparently if you include bootstrap.js you shouldn't also inlclude bootstrap-modal.js because boostrap.js imports all of the javascript plugins that it is compatible with. Something like that. After deleting my boostrap-modal.js script link it worked.

我的问题是我把这两款boostrap都包括进去了。js和bootstrap-modal.js。显然,如果你包含引导。js你也不应该加入bootstrap-modal。因为boostrap js。js导入它兼容的所有javascript插件。就像这样。我boostrap-modal后删除。js脚本链接起作用了。

#2


4  

You have to call:

你必须调用:

<script>
   $('#myModal').modal('show')
</script>

After the </body> tag. Or if you only want to call it when the user clicks on something:

< /身体>标记。或者,如果你只想在用户点击某样东西时调用它:

$('#button_id').click(function(){
    $('#myModal').modal('show')
});