0
Q
複選框頂部下拉
A
回答
0
希望這會幫助你!
var options = [];
$('.dropdown-menu a').on('click', function(event) {
var $target = $(event.currentTarget),
val = $target.attr('data-value'),
$inp = $target.find('input'),
idx;
if ((idx = options.indexOf(val)) > -1) {
options.splice(idx, 1);
setTimeout(function() { $inp.prop('checked', false) }, 0);
} else {
options.push(val);
setTimeout(function() { $inp.prop('checked', true) }, 0);
}
$(event.target).blur();
console.log(options);
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="button-group">
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-check"></span> <span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#" class="small" data-value="option1" tabIndex="-1"><input type="checkbox"/> Option 1</a></li>
<li><a href="#" class="small" data-value="option2" tabIndex="-1"><input type="checkbox"/> Option 2</a></li>
<li><a href="#" class="small" data-value="option3" tabIndex="-1"><input type="checkbox"/> Option 3</a></li>
<li><a href="#" class="small" data-value="option4" tabIndex="-1"><input type="checkbox"/> Option 4</a></li>
<li><a href="#" class="small" data-value="option5" tabIndex="-1"><input type="checkbox"/> Option 5</a></li>
<li><a href="#" class="small" data-value="option6" tabIndex="-1"><input type="checkbox"/> Option 6</a></li>
</ul>
</div>
</div>
</div>
</div>
+0
感謝您的回答 但我需要的是一個複選框ontop下拉 點擊複選框時所有的行被選中,而在點擊下拉時有單獨的選項。 你提供的東西總是給我們從選項無論我們點擊 –
相關問題
- 1. 添加複選框,下拉
- 2. 複選框下拉列表
- 3. 複選框在下拉
- 4. 將選擇框的下拉列表放置在選擇框的頂部
- 5. 添加下拉框和複選框值
- 6. 組合框與複選框的下拉
- 7. 從下面的複選框下拉
- 8. Javascript複選框onclick只與頂部
- 9. 複選框內聯下拉選項
- 10. 根據下拉選中複選框
- 11. 多選下拉與複選框功能
- 12. 多選複選框下拉菜單
- 13. 禁用複選框和下拉列表
- 14. HTML JS下拉式複選框
- 15. 驗證複選框或下拉列表
- 16. asp.net下拉列表與複選框
- 17. 打開在下拉多複選框
- 18. Bootstrap動態下拉複選框格式
- 19. Yii複選框在下拉列表
- 20. 一個下拉菜單,複選框
- 21. 需要複選框和下拉列表
- 22. jQuery複選框下拉控件
- 23. 複選框不顯示下拉值
- 24. 下拉式複選框列表cakephp
- 25. Rails Multiple複選框與下拉列表
- 26. JavaScript鏈接下拉菜單複選框
- 27. 下拉式複選框不能切換
- 28. 根據複選框更改下拉值
- 29. 從下拉菜單創建複選框
- 30. 下拉列表來填充複選框
沒有代碼,沒有幫助 – caramba
從哪裏獲得代碼這個??? 這個單行的人 –