如何通過關鍵事件

-2

我作出了選擇框，把關鍵事件KeyDown滾輪不會下降，但關鍵事件和價值選擇運作良好 enter image description here 如何通過關鍵事件

小提琴只是後獲取可視值它周圍的工作，所以如何控制滾輪
http://jsfiddle.net/nsoni/d8FNp/1/

HTML：

<div class="scrol"> 
    <div class="ful ful_1">1</div> 
    <div class="ful ful_2">2</div> 
    <div class="ful ful_3">3</div> 
    <div class="ful ful_4">4</div> 
    <div class="ful ful_5">5</div> 
    <div class="ful ful_6">6</div> 
    <div class="ful ful_7">7</div> 
    <div class="ful ful_8">8</div> 
    <div class="ful ful_9">9</div> 
    <div class="ful ful_10">10</div> 
</div>

的jQuery：

var i=1; 
$(window).bind('keydown', function(e){ 
    if (e.keyCode==13) { 
     alert($('.change').text()); 
    } else if (e.keyCode==40) { 
     if(i>=11)i=1; 
     $('.ful').removeClass("change"); 
     $('.ful_'+i).addClass("change"); i++;  
    } 
    else if (e.keyCode==38) { 
     if(i<=0)i=10; 
     $('.ful').removeClass("change"); 
     $('.ful_'+i).addClass("change"); i--; 
    } 
});

CSS：

.scrol{ 
    width:50%; 
    height:160px; 
    overflow-y: scroll; 
    overflow-x:hidden; 
} 
.ful{ 
    background:grey; 
    margin-bottom:2px; 
    border:1px solid; 
} 
.change{ 
    background:#fff; 
} 
.change1{ 
    background:#cdcdcd; 
}

來源

2014-06-25 Nidhi

我不明白問題如何匹配的圖像和說明到什麼是在小提琴？ –

不明白這個問題...請詳細說明。 –

只需使用'up'和'down'鍵。它突出顯示了nos。她想要顯示隱藏在'overflow'中的突出顯示的no，可以通過動態滾動它。 – Jashwant

也許這正好在你想要的方向？

var i = 1; 

$(document).on('keydown', function (e) { 

    if (e.keyCode == 13) { 
    } else if (e.keyCode == 40) { 
     i++; 
     if (i >= 11) i = 1; 
     $('.ful').removeClass("change"); 
     $('.ful_' + i).addClass("change"); 
     $('.scrol').animate({scrollTop:$('.ful_' + i).offset().top},200); 

    } else if (e.keyCode == 38) { 
     i--; 
     if (i <= 0) i = 10; 
     $('.ful').removeClass("change"); 
     $('.ful_' + i).addClass("change"); 
     $('.scrol').animate({scrollTop:$('.ful_' + i).offset().top}, 200); 

    } 
    e.preventDefault(); 
});

http://jsfiddle.net/a99He/2/

來源

2014-06-25 07:29:32 Tomm

謝謝湯姆，我從這個小提琴得到了我的答案:) – Nidhi

如何通過關鍵事件

回答

相關問題