我试图从使用jquery-bonsai创建的树结构中选择(选中)值(链接:http://simonwade.me/jquery-bonsai/)
我的代码:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<link rel='stylesheet' type='text/css' href='http://bgagenomics.iicb.res.in/bga/arup/js/assets/svg-icons.css' />
<link rel='stylesheet' type='text/css' href='http://bgagenomics.iicb.res.in/bga/arup/js/jquery.bonsai.css' />
<script src='http://bgagenomics.iicb.res.in/bga/arup/js/jquery.bonsai.js'></script>
<script src='http://bgagenomics.iicb.res.in/bga/arup/js/jquery.qubit.js'> </script>
<script>
jQuery(function() {
$('#auto-checkboxes').bonsai({
expandAll: false,
checkboxes: true, // qbit plung helper
createInputs: 'checkbox' // enebles auto click data-checked
});
});
$(document).ready(function(){
$("#val").click(function()
{
alert("hello"); //need help here
});
});
</script>
</head>
<body>
<div>
<ol id='auto-checkboxes' data-name='foo'>
<li data-value='0'>All
<ol>
<li data-value='1'>One</li>
<li data-value='2' data-id='2'>
Two
<ol>
<li data-name='baz' data-value='3'>
Three
<ol>
<li data-name='baz' data-value='4'>Four</li>
</ol>
</li>
<li data-value='5'>Five</li>
</ol>
</li>
</ol>
</li>
</ol>
</div>
<br>
<input id ="val" type="image" value = "Result" />
<body>
</html>
上面的代码将创建像
这样的树结构我希望点击结果时获得选中的值。
解决上述问题的任何帮助或建议都将是一个很大的帮助。
答案 0 :(得分:1)
您可以通过循环查找所选复选框来获取所有选中复选框的值:
var yourArray = [];//global variable
$(document).ready(function(){
$("#val").click(function() {
yourArray = [];//unset previous values
$("input:checkbox[name=yourCheckboxName]:checked").each(function(){
yourArray.push($(this).val());
});
});
});