<!-- <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" async></script> -->
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" async></script> -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" async></script>
<script src="https://use.fontawesome.com/0d83f3667e.js" async></script>
<script src="<?php echo $assets ?>js/timepicki.min.js" async></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" async></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js" async></script>
<!-- <script src="//code.jquery.com/jquery-1.12.3.min.js" async></script> -->
<nav class="navbar navbar-inverse" style="border-radius: 0px;">
<div class="container-fluid" style="background-color: #000; ">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="" href="<?php echo base_url(); ?>" style="padding: 20px; ">
<img src="<?php echo $assets ?>images/logo.jpg" style="width: 70%; margin-top: 5%; float: left;">
</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="<?php echo base_url(); ?>home" style="background-color: transparent;">Home</a></li>
<?php
if($this->session->userdata('user_role') == "vender" or $this->session->userdata('user_role') == "user")
{
?>
<li><a href="<?php echo base_url(); ?>booking/user_booking_list">Booking</a></li>
<?php
}
?>
<?php
if($this->session->userdata('user_role') == "vender")
{
?>
<li class="dropdown">
<a class="dropdown-toggle nav-menu" data-toggle="dropdown" style="color:#9d9d9d !important" href="#">My Cars<span class="caret"></span></a>
<ul class="dropdown-menu drop-down-list">
<li><a href="<?php echo base_url(); ?>venders/add_cars/" class="drop-down-list-item font">Add Car</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars/?status=approved" class="drop-down-list-item font">View cars</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars?status=pending" class="font">Pending Approvals</a></li>
</ul>
</li>
<?php
}
?>
<li class="active" style="display:none;"><a href="<?php echo base_url(); ?>about/" style="background-color: transparent;">About</a></li>
<li class="active"><a href="<?php echo base_url(); ?>contact/" style="background-color: transparent;">Feedback</a></li>
<li class="active"><a href="<?php echo base_url(); ?>terms/" style="background-color: transparent;">Terms Of Use</a></li>
<li class="active"><a href="<?php echo base_url(); ?>privacy/" style="background-color: transparent;">Privacy Policy</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<?php
if(!$this->session->userdata('user_role'))
{
?>
<li><a href="<?php echo base_url(); ?>signup"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="<?php echo base_url(); ?>login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
<?php
}else{
?>
<li><a href="<?php echo base_url(); ?>home">Welcome <?php echo ucfirst($this->session->userdata('username')); ?></a></li>
<?php
}
?>
<?php
if($this->session->userdata('user_role') == "vender" || $this->session->userdata('user_role') == "user")
{
?>
<li class="dropdown">
<a class="dropdown-toggle nav-menu" data-toggle="dropdown" style="color:#9d9d9d !important" href="#">My Account<span class="caret"></span></a>
<ul class="dropdown-menu drop-down-list">
<li style="display:none;"><a href="<?php echo base_url(); ?>users/profile/" class="drop-down-list-item font">Profile</a></li>
<li><a href="<?php echo base_url(); ?>logout/" class="font">Logout</a></li>
</ul>
</li>
<?php
}
?>
</ul>
</div>
</div>
</nav>
我的下拉菜单仅在单击主页时有效。其他页面似乎工作正常，只有下拉列表“我的汽车”不响应其他页面上的用户交互。此外，它在移动设备上根本不起作用。点击手机上的下拉菜单时，没有任何反应。可能是什么问题呢？这是我的网站：http://www.yiyalo.com 链接到我的源代码：https://github.com/stephenleong/MyProject
答案 0 :(得分：0)
将您的代码li更改为div
示例：
在：
<li class="dropdown">
<a class="dropdown-toggle nav-menu" data-toggle="dropdown" style="color:#9d9d9d !important" href="#">My Cars<span class="caret"></span></a>
<ul class="dropdown-menu drop-down-list">
<li><a href="<?php echo base_url(); ?>venders/add_cars/" class="drop-down-list-item font">Add Car</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars/?status=approved" class="drop-down-list-item font">View cars</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars?status=pending" class="font">Pending Approvals</a></li>
</ul>
</li>
后：
<div class="dropdown"> <!-- Here -->
<a class="dropdown-toggle nav-menu" data-toggle="dropdown" style="color:#9d9d9d !important" href="#">My Cars<span class="caret"></span></a>
<ul class="dropdown-menu drop-down-list">
<li><a href="<?php echo base_url(); ?>venders/add_cars/" class="drop-down-list-item font">Add Car</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars/?status=approved" class="drop-down-list-item font">View cars</a></li>
<li><a href="<?php echo base_url(); ?>venders/all_cars?status=pending" class="font">Pending Approvals</a></li>
</ul>
</div> <!-- And here -->
答案 1 :(得分：0)
你有很多错误，修复它们应该是你的第一要务。如果它们被修复并且问题仍然存在，那么您将需要解决问题，如下所示：
$(".dropdown-toggle:first").click(function(e) {
var brothers = $(this).siblings("ul");
brothers[(brothers.css("display") !== "block") ? "show" : "hide"]();
}).blur(function(e) {
var brothers = $(this).siblings("ul");
brothers.hide();
});
click将处理您的click活动，blur您的blur活动，请注意我使用hide和show的方式function个名字。