Modal中的Bootstrap链接不起作用:JQuery错误

时间:2015-04-01 08:30:13

标签: jquery html twitter-bootstrap

我有一些HTML

<div class="modal fade" id="product-add-to-cart-modal-ssbt" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-body">

                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

                        <div class="row quick-view product-main">
                            <div class="col-sm-12">

                                <p class="lead text-center">One <b>{Product Name}</b> will be added to your cart.
                                </p>  

                                <div class="box">
                                    <p class="text-muted text-small text-center">
                                        What do you want to do next?
                                    </p>

                                    <div class="box-footer" id="add-to-cart-buttons">
                                        <a href="?add_product=10161">
                                            <i class="fa fa-reply"></i>Return to current page
                                        </a>
                                        <a href="/site/cart?add_product=10161">
                                            <i class="fa fa-shopping-cart"></i>Go to shopping cart
                                        </a>
                                    </div>    
                                </div>
                                <!-- /.box -->

                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <!--/.modal-dialog-->
        </div>

<button class="btn btn-primary" data-toggle="modal" data-target="#product-add-to-cart-modal-ssbt" onclick="return false;">Add to cart</button>

当我点击模态中的任意两个链接时,它不会去任何地方。看一下控制台,我看到了这个错误:

  

未捕获错误:语法错误,无法识别的表达式:?add_product = 10161

然后它在右边引用 jquery-1.11.1.min.js:2

我无法在JSFiddle中复制我的错误。它在那里工作。见这里:http://jsfiddle.net/gk6o4cmr/

有人可以帮我弄清楚我的代码有什么问题吗?

1 个答案:

答案 0 :(得分:0)

我发现了问题。 此按钮和模态位于选项卡内。由于某种原因,我在本页底部有一段脚本,它改变了tab div中achor标签的行为。

jQuery('#product_details_tabs a').not('.external-link').click(function (e) {
  e.preventDefault()
  jQuery(this).tab('show')
})

事实证明,在我更新了一些代码之后,无论如何我都不需要这个脚本,所以只要删除它,问题就会消失。