luc*_*old 27 html javascript jquery twitter-bootstrap
我正在使用Bootstrap 3和JavaScript "创建"我自己的"ComboBox" .Here is the JSFiddle对于我到目前为止:
<div class="input-group">
<input type="TextBox" ID="datebox" Class="form-control"></input>
<div class="input-group-btn">
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul id="demolist" class="dropdown-menu">
<li><a href="#">A</a></li>
<li><a href="#">B</a></li>
<li><a href="#">C</a></li>
</ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
$(document).on('click', '.dropdown-menu li a', function() {
$('#datebox').val($(this).html());
});
Run Code Online (Sandbox Code Playgroud)
这种方法效果很好,直到我想在页面上多次重复这个"ComboBox".问题在于JQuery函数正在寻找ANY/ALL '.dropdown-menu li a'.
如何更改我的JQuery以仅查找具有ID demolist的 UL 并获取其选定值?
我试过以下没有成功:
我尝试过'#demolist .dropdown-menu li a'但不会触发该功能:
$(document).on('click', '#demolist .dropdown-menu li a', function() {
$('#datebox').val($(this).html());
});
Run Code Online (Sandbox Code Playgroud)
我尝试调用#demolist的Click但#datebox获取#demolist的所有列表项的HTML而不是选择的itemHTML 项:
$('#demolist').on('click', function(){
$('#datebox').val($(this).html());
});
Run Code Online (Sandbox Code Playgroud)
工作解决方案是:
$('#demolist li a').on('click', function(){
$('#datebox').val($(this).html());
});
Run Code Online (Sandbox Code Playgroud)
要么
$('#demolist li').on('click', function(){
$('#datebox').val($(this).text());
});
Run Code Online (Sandbox Code Playgroud)
Rya*_*yan 31
$('#demolist li').on('click', function(){
$('#datebox').val($(this).text());
});
Run Code Online (Sandbox Code Playgroud)
小智 6
使用 Bootstrap 设计代码
<div class="dropdown-menu" id="demolist">
<a class="dropdown-item" h ref="#">Cricket</a>
<a class="dropdown-item" href="#">UFC</a>
<a class="dropdown-item" href="#">Football</a>
<a class="dropdown-item" href="#">Basketball</a>
</div>Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
$('#demolist a').on('click', function () {
var txt= ($(this).text());
alert("Your Favourite Sports is "+txt);
});
});
</script>Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
104651 次 |
| 最近记录: |