twitter-bootstrap 引导程序 3 模态窗口不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19210357/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 18:46:04  来源:igfitidea点击:

bootstrap 3 modal window not working

twitter-bootstrapmodal-dialogtwitter-bootstrap-3

提问by x64vs32x

I'm using Bootstrap 3 (full version) and I use bootstrap modal in my code:

我正在使用 Bootstrap 3(完整版)并在我的代码中使用 bootstrap modal:

<a data-toggle="modal" data-target="deleteMessage" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-remove"></span> Удалить</a>

<!-- Modal -->
<div id="deleteMessage" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                ...
            </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><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

This code I copied from official docs, but it's not working, modal window does not display.

我从官方文档中复制了这段代码,但它不起作用,模态窗口不显示。

Whats the problem?

有什么问题?

Many thanks.

非常感谢。

回答by fascynacja

Try to change your anchor code into:

尝试将您的锚代码更改为:

<a data-toggle="modal" data-target="#deleteMessage" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-remove"></span> Удалить</a>

It looks like there is a typo in the tutorial, there should be additional "#" in the data-targetattribute.

教程中好像有错别字,data-target属性中应该多加“#” 。

回答by ?s??? ????

You forgot to include #into data-targetattribute

您忘记包含#data-target属性中

<a data-toggle="modal" data-target="#deleteMessage" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-remove"></span> Удалить</a>

Live DEMO

现场演示