我的页面上有几个下拉菜单。我正在尝试更改选定的值,并且遇到了很大的问题。似乎什么都没发生。似乎我的jquery代码根本没有被调用或者它是否有效?。
我在一个嵌入在布局页面中的mvc视图中添加了我的下拉列表。以前我在布局页面标题中添加了我的Java脚本代码,如下所示。
<script type="text/javascript">
$(function(){
$(".dropdown-menu li a").click(function(){
$(".btn:first-child").text($(this).text());
$(".btn:first-child").val($(this).text());
});
});
</script>
以下是我在LayoutPage @RenderPage上呈现的视图中的下拉
<div class="btn-group">
<a class="btn btn-default dropdown-toggle btn-select" data-toggle="dropdown"> <span data-bind="label">Select a Country</span>
<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
<li><a href="#">United States</a></li>
<li><a href="#">Canada</a></li>
<li class="divider"></li>
<li><a href="#"><span class="glyphicon glyphicon-star"></span> Other</a></li>
</ul>
</div>
<div class="btn-group">
<a class="btn btn-default dropdown-toggle btn-select" data-toggle="dropdown"> <span data-bind="label">Select a State</span>
<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
<li><a href="#">Washingtong</a></li>
<li><a href="#">California</a></li>
<li class="divider"></li>
<li><a href="#"><span class="glyphicon glyphicon-star"></span> Other</a></li>
</ul>
</div>
我尝试了很多替代方案,如问题Here中所示,并没有成功。请问我哪里出错了?任何帮助将不胜感激
答案 0 :(得分:0)
谢谢你们,找到了这个问题。就像我怀疑我的javascrip代码没有执行。我刚刚意识到我的脚本是在jQuery.js脚本引用之前编写的。就像
<script type="text/javascript">
My script .
</script>
<script src="~/Content/js/bootstrap.min.js"></script>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
我现在将其更改为
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
<script type="text/javascript">
My script .
</script>
它现在正在工作。所以JQuery必须首先被引用/加载。那是我犯的错误。谢谢大家。