-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