Jquery 在下拉列表中将键盘导航添加到复选框列表
我有一个“DropDownCheckBoxList”用户控件,是我用文本框、图像(箭头)和一个隐藏的ASP.Net CheckBoxList控件在下拉DIV中从头创建的 结合许多JQuery,它工作得很好,除了最后一个特性。。。下拉列表项的键盘上/下导航 看起来是这样的: 生成的HTML示例如下所示:Jquery 在下拉列表中将键盘导航添加到复选框列表,jquery,asp.net,user-controls,checkboxlist,keyboard-navigation,Jquery,Asp.net,User Controls,Checkboxlist,Keyboard Navigation,我有一个“DropDownCheckBoxList”用户控件,是我用文本框、图像(箭头)和一个隐藏的ASP.Net CheckBoxList控件在下拉DIV中从头创建的 结合许多JQuery,它工作得很好,除了最后一个特性。。。下拉列表项的键盘上/下导航 看起来是这样的: 生成的HTML示例如下所示: 你知道我还需要做什么才能让它导航吗?这只是在下拉列表中使用复选框列表的问题吗?我是否误用了导航加载项?您能为下拉列表显示相关的JS吗?@Gísli Konráð:相关的JS可以运行300多行,因
你知道我还需要做什么才能让它导航吗?这只是在下拉列表中使用复选框列表的问题吗?我是否误用了导航加载项?您能为下拉列表显示相关的JS吗?@Gísli Konráð:相关的JS可以运行300多行,因为它同时用作下拉复选框列表和智能下拉列表框。它也是保密的,因为它是客户的现场工作。不过,我自己已经解决了这个问题,因为没有第三方插件可以使用它,明天我会发布一个答案。谢谢
<div style="width: 170px;" class="dropDownComboxBoxList">
<div onclick="DropDown('#MainContent_DropDownCheckBoxList1_dropDownDiv', '#MainContent_DropDownCheckBoxList1_dropDownTextBox')" class="dropDownControl" id="MainContent_DropDownCheckBoxList1_dropDownControl">
<div style="width: 150px;" class="dropDownLeft">
<input type="text" class="dropDownEdit" id="MainContent_DropDownCheckBoxList1_dropDownTextBox" readonly="readonly" value="Item 0, Item 1" name="ctl00$MainContent$DropDownCheckBoxList1$dropDownTextBox">
</div>
<div class="dropDownRight">
<img src="http://localhost:28071/Images/DropDown_off.gif" class="dropDownImg img-swap" id="MainContent_DropDownCheckBoxList1_dropDownImage">
</div>
</div>
<div style="width: 300px; max-height: 300px; margin-top: 0px; display: none;" class="dropDownDiv" id="MainContent_DropDownCheckBoxList1_dropDownDiv">
<table style="height: 40px; width: 290px;" class="checkBoxList dropDownTable" id="MainContent_DropDownCheckBoxList1_checkBoxList">
<tbody>
<tr class="checkSel">
<td><input type="checkbox" value="0" checked="checked" id="MainContent_DropDownCheckBoxList1_checkBoxList_0" class="dropDownCheck"><label for="MainContent_DropDownCheckBoxList1_checkBoxList_0" class="dropDownLabel">Item 0</label></td>
</tr>
<tr class="checkSel">
<td><input type="checkbox" value="1" checked="checked" id="MainContent_DropDownCheckBoxList1_checkBoxList_1" class="dropDownCheck"><label for="MainContent_DropDownCheckBoxList1_checkBoxList_1" class="dropDownLabel">Item 1</label></td>
</tr>
<tr>
<td><input type="checkbox" value="2" id="MainContent_DropDownCheckBoxList1_checkBoxList_2" class="dropDownCheck"><label for="MainContent_DropDownCheckBoxList1_checkBoxList_2" class="dropDownLabel">Item 2</label></td>
</tr>
<tr>
<td><input type="checkbox" value="3" id="MainContent_DropDownCheckBoxList1_checkBoxList_3" class="dropDownCheck"><label for="MainContent_DropDownCheckBoxList1_checkBoxList_3" class="dropDownLabel">Item 3</label></td>
</tr>
</tbody>
</table>
</div>
</div>
$('#MainContent_DropDownCheckBoxList1_checkBoxList').filter('td').navigate({ mouse: true, activeClass: 'checkHover' });