-1
我使用的是bxSlider,但我無法集中我的<ul>
列表的子元素。我想在其中集中<div>
或<li>
。下面是我的HTML代碼部分:使用jQuery無法聚焦子元素
<div class="bx-wrapper" style="max-width: 1308px; margin: 0px auto;">
<div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 58px;">
<ul id="jalur" class="jalur" tabindex="21" style="width: 2715%; position: relative; transition-duration: 0s; transform: translate3d(-40px, 0px, 0px);">
<li id="lix1" style="float: left; list-style: outside none none; position: relative; width: 218px;">
<div class="fl">
<div id="e1" class="fl kurohige-prev jaman" data-time="00:30">00:30-01:00</div>
<div class="fl line-0"></div>
</div>
</li>
<li id="lix2" style="float: left; list-style: outside none none; position: relative; width: 218px;">
...
</ul>
</div>
我試圖把重點放在孩子<div>
ID爲 'E1',但未能成功。下面是相關的JavaScript代碼:
$(document).on("keydown", function(event) {
var key = event.which;
console.log(key); //39-->right 37-->left, 38-->up 40-->down
if (key == '39') //success
{
var foc = $(':focus');
$(foc).next().focus();
console.log(foc);
}
else if (key == '37') //success
{
var foc = $(':focus');
$(foc).prev().focus();
console.log(foc);
}
else if (key == '40') //failed
{
$('#jalur li').first().focus();
var foc = $(':focus');
console.log(foc);
}
else if (key == '38') //failed
{
$('#jalur').children(":first").focus();
var foc = $(':focus');
console.log(foc);
}
});
但是,使用Firebug的命令行我可以去任何元素:
$('#jalur li').first().focus();
這會給下面的輸出:
Object[li#lix1]
我想以從<div>
得到data-time="00:30"
,並且也關注它。
注重'li'。這個事件不會工作隱含地適用於有限的一組元素,例如表單元素(,
它可能來自應對和粘貼代碼不正確。但是這個代碼有錯誤。從技術上講,你不能擁有'else if(key =='40')',它需要是一個'if(key =='40')'並且你在末尾缺少''''''。 –
感謝您的評論,編輯... – anunixercoder