模式内的 href 链接不起作用

Question

我的网页中有一个使用 Bootstrap 的模态。我在其中添加了锚标记，其中有 href 链接。当我尝试单击该锚元素时，它不可单击。锚标记在模态中不起作用。

请帮我解决这个问题。

请找到下面的代码 -

<div class="portfolio-modal modal fade" id="editionsModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-content">
        <div class="close-modal" data-dismiss="modal">
            <div class="lr">
                <div class="rl">
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-lg-offset-2">
                    <div class="col-sm-3">
                        <a href="hingoli.html" data-target="#" style="text-decoration: none;">
                            <div style="padding:15px; color:#181818; text-align: center; ">
                                <h4>Hingoli</h4>
                            </div>
                            <img src="pages/hingoli/1.jpg" style="margin: 0 auto; display: block;" class="modal-img" alt="">
                        </a>

                    </div>
                    <div class="col-sm-3">
                        <a href="parbhani.html" class="portfolio-link" style="text-decoration: none;">
                            <div style="padding:15px; color:#181818; text-align: center; ">
                                <h4>Parbhani</h4>
                            </div>
                            <img src="pages/parbhani/1.jpg" style="margin: 0 auto; display: block;" class="modal-img" alt="">
                        </a>

                    </div>
                    <div class="modal-body">
                        <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

我在 Bootstrap 4 中也有同样的行为，结果发现.modal-dialogdiv 有一个pointer-events: none;禁用链接的属性。设置pointer-events: all;为我修复它。