我正在尝试在使用TAB键进行聚焦时打开<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="h3">Open select2 on focus</h1>
<p>Click on the email input then use tab to change to select2 field. You will notice that select2 dropdown doesn't open.</p>
<form action="#">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
<br>
<label for="select2">Here is select2</label>
<select class="form-control js-select" multiple="multiple">
<option value="1">Option A</option>
<option value="2">Option B</option>
<option value="3">Option C</option>
</select>
<br/>
<label for="firstName">First name</label>
<input type="text" class="form-control" id="firstName" placeholder="Name">
<br>
<label for="lastName">Last name</label>
<input type="text" class="form-control" id="lastName" placeholder="Surname">
<br>
</form>
</div>
</div>
</div>
。我在stackoverflow上找到了一些建议,但它们并不适用于我。最后,我来了解决方案(https://jsfiddle.net/shimon001/k06g0tgj/6/):
HTML :
$('.js-select').select2({
placeholder: "Select",
width: "100%",
multiple: false
});
$('.js-select').on('select2:open', function(){
console.log('opened');
});
$('.container').on('keyup', 'form', function(e) {
var keyCode = e.keyCode || e.which;
e.stopPropagation();
if (keyCode == 9) {
console.log('TAB');
var focused = document.activeElement;
console.log(focused);
if ($(focused).hasClass('select2-selection')) {
console.log('has class');
$(focused).closest('.select2').prev().select2('open');
}
}
});
JS:
select2
我可以在使用TAB键进行聚焦时打开select2
但是我无法使用TAB键进一步遍历表单。
我尝试检查哪个元素在body
元素之后聚焦,它是select2
元素。我想这是因为当打开select2
框时,焦点会从表单中跳出来。
有什么建议,可以在离开if(linkedlist == null)
{
//head node is null i.e, linked list is empty hence make the new node as head node
linkedlist = new_element;
}else{
//make the new node point to the head
new_element->next = linkedlist;
//make the new node as head node
linkedlist = new_element;
}
框后继续使用表单中的下一个元素吗?
由于 希蒙