如何解决没有通过箭头键在我的表格中聚焦此选择框,但所有其他字段都成功聚焦了
我是jQuery的初学者,并且有一种场景,其中我的表中有选择框和文本字段;我实现了箭头键(下一个向下键,上一个向上键),通过为每个字段提供一个类,将焦点转移到该字段上。
问题是选择框显示的选项通过Ajax 不能聚焦。
jQuery用于箭头键移位:
var classNames = $(this).attr("class").split(" ");
// console.log("aftersplit:" + classNames);
for ( var contarray = 0,l = classNames.length; contarray < l; contarray++ )
{
var current_iterating_class=classNames[contarray];
if(current_iterating_class.indexOf("table2_index_")!= -1)
{
var current_class=current_iterating_class;
// console.log("currently:=="+current_class);
}
// console.log("current_iterating_class===" +current_iterating_class );
}
console.log("current_class=="+current_class);
var pos= current_class.substr(current_class.indexOf("_") +7);
// console.log("position"+pos);
pos=Number(pos);
if(e.keyCode == 40){ //downarrow(forw)
pos += 1;
// console.log("pos+1=" + pos);
$(".table2_index_"+pos).focus();
if(this.tagName == "SELECT" || this.tagName == "select") {
}
// console.log("down"+pos);
}
if(e.keyCode==38){
pos -= 1;
$(".table2_index_"+pos).focus();
// console.log("upp"+pos);
}
表格HTML:
<td>
<select class="typecode inputbox input_table2 table2_index_1" name="typecode[]">
<option value="S">S</option>
<option value="R">R</option>
<option value="O">O</option>
</select>
</td>
<td><input type="text" class="code inputbox input_table2 table2_index_2" name="code[]" style="width: 100%">
<input type="hidden" class="product_id" name="product_id[]" style="width: 100%">
</td>
<td id="item" class="item" align="center">
<select class="select_item inputbox input_table2 table2_index_3" name="item[]">
<option selected="selected"></option>
</select>
<input type="hidden" name="product_id_val" value="0">
</td>
<td><input type="text" class="type inputbox input_table2 table2_index_4" name="type[]" style="width: 100%"></td>
用于选择选项的Ajax:
$(".select_item").select2({
ajax: {
url: "' . $selectitem . '",dataType: "json",}
}).on("change",function () {
var this_=$(this);
this_.closest("tr.rowacc").find(".product_id").val(this.value);
getitemvalues( this.value,this_);
});
其他静态选择框正在工作,我找不到问题。
解决方法
$('#id').select2('open');
//Init Select2
$('.b_select').select2();
// Make Select2 respect tab focus
function dropdownFocus(){
$(window).keyup(function (e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 40 && jQuery('.select2-search__field:focus').length) {
jQuery('.b_select').select2('open');
}
});
}
dropdownFocus();//init function
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。