Twitter Bootstrap下拉PHP链接未打开

Twitter Bootstrap Dropdown PHP link not opening

本文关键字:链接 PHP Bootstrap 下拉 Twitter      更新时间:2023-09-26

我已经创建了一个下拉菜单,并在PHP页面中使用。我想主按钮(有下拉链接的一个)也仍然有效,并指的是一个页面。我做了Bootstrap页面告诉我要做的一切,但由于某种原因,它仍然不起作用。(http://getbootstrap.com/javascript/#dropdowns)

<li class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="?action=landing">
        <i class="icon-info"></i>Information <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
        <li><a href="#">dropdown #1</a></li>
        <li><a href="#">dropdown #2</a></li>
    </ul>
</li>

这是HTML,这是我使用的JS:

<script type="text/javascript">
    var revapi;
    jQuery(document).ready(function() {
        $('.dropdown-toggle').dropdown()  
    });
    $('.dropdown').hover(function(){ 
        $('.dropdown-toggle', this).trigger('click'); 
    });
</script>

如何让主按钮(信息)链接到"?action =着陆"?

在经历了很多挫折之后,我已经设法通过创建pseudo-link并将下拉菜单放在上面来完成它。

小提琴:http://jsfiddle.net/zwfNL/1/
Javascript

var revapi;
jQuery(document).ready(function () {
    $('.dropdown-toggle').dropdown()
});
$('.dropdown').hover(function () {
    $('.dropdown-toggle').dropdown('toggle')
});

CSS(必要-覆盖引导背景)

#dropdown-link{
    position:relative;
    z-index:10000;
}

<li class="dropdown">
    <a id="dropdown-link" href="?action=landing"><i class="icon-info"></i>Information <span class="caret"></span></a>
    <a style="display:none;" class="dropdown-toggle" data-toggle="dropdown" data-target="#"></a>
    <ul class="dropdown-menu">
        <li><a href="#">dropdown #1</a>
        </li>
        <li><a href="#">dropdown #2</a>
        </li>
    </ul>
</li>

问题是Bootstrap阻止了href的默认行为。

所以你需要在jQuery中做:

jQuery("a.dropdown-toggle").click(function(){
    window.location.href = "http://example.com/?action=landing";
});

编辑

它会因为这个而出错:

$('.dropdown').hover(function(){ 
    $('.dropdown-toggle', this).trigger('click'); 
});

代替
$('.dropdown').hover(function(){ 
    $('.dropdown-toggle', this).dropdown('toggle'); 
}, function(){
    $('.dropdown-toggle', this).dropdown('toggle');
});