这是我的JSFiddle: JSFiddle Link
在这里,我想仅选择1个主选项。即
我的 HTML:
<div class="topic-search">
<ul class=" topic-dropdown-menu">
<li class="topic-search-mainmenu" id="" data-topic="Bond">
<input type='checkbox' name='topics[]' class='ticker-menu' id="BOND" value=''>Bond
</li>
<li class="topic-search-dropdown-submenu">
<p class="topic-open">Commodities <i class="fa fa-angle-down"></i></p>
<ul class="topic-search-submenu">
<li class="topic-search-submenu-mainmenu" data-topic="Commodities">
<input type='checkbox' name='topics[]' class='ticker-menu' id="CMMD" value=''>Commodity
</li>
<li class="topic-search-submenu-mainmenu" data-topic="Commodities">
<input type='checkbox' name='topics[]' class='ticker-menu' id="NTRL" value=''>Natural
</li>
</ul>
</li>
<li class="topic-search-mainmenu" data-topic="Market" >
<input type='checkbox' name='topics[]' class='ticker-menu' id="MRKT" value=''>Market
</li>
<li class="topic-search-dropdown-submenu">
<p class="topic-open">Entertainment <i class="fa fa-angle-down"></i></p>
<ul class="topic-search-submenu">
<li class="topic-search-submenu-mainmenu" data-topic="Gas">
<input type='checkbox' name='topics[]' class='ticker-menu' id="CMD" value=''>Celeb
</li>
<li class="topic-search-submenu-mainmenu" data-topic="Gas">
<input type='checkbox' name='topics[]' class='ticker-menu' id="GAS" value=''>Public Gossip
</li>
</ul>
</li>
</ul>
</div>
我的 jQuery
var ticker_menu = $("input.ticker-menu");
var parent_data_topic_name = "";
ticker_menu.on('click', function() {
// $(this).prop('checked', true);
if(parent_data_topic_name ==""){
parent_data_topic_name = $(this).parent().attr('data-topic');
ticker_menu.not(this).prop('checked', false);
}
else{
parent_data_topic_name = $(this).parent().attr('data-topic');
ticker_menu.each(function( e ) {
if(ticker_menu.not(this).is(':checked') && ticker_menu.parent().attr('data-topic') == parent_data_topic_name){
var id_name = ticker_menu.not(this).attr('id');
$(""+id_name).prop('checked', true);
}else{
var id_nam = ticker_menu.not(this).attr('id');
$(""+id_name).prop('checked', false);
}
});
}
});
我该如何实现?