2011-02-04 88 views
0
<input type="text" id="region" class="inputs" name="remo"> 

<ul id="ulList"> 
<li id="idr0"></li> 
<li id="idr1">Baltimore</li> 
<li id="idr2">India</li> 
<li id="idr3">International - Russia</li> 
<li id="idr4">MD 19940</li> 
<li id="idr5">Minnesota</li> 
<li id="idr6">North Carolina</li> 
</ul> 

我需要的時候選擇的keydown /向上然後設置與李值的輸入值jQuery代碼jQuery的選擇裏價值高達

+1

嘛,你嘗試過什麼? – lonesomeday 2011-02-04 18:19:32

+0

我們都需要一些代碼。你的問題是什麼?有沒有你試圖解決的問題,沒有奏效,你想問一下?因爲如果沒有這個問題不應該在這裏被問到。以下是您可能會閱讀的一篇不錯的[博客文章](http://msmvps.com/blogs/jon_skeet/archive/2010/08/29/writing-the-perfect-question.aspx)。 – 2011-02-04 18:20:12

回答

0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#region').live('keypress', function (e) { 
       var objCurrentLi, obj = $('#ulList').find('.SelectedLi'), objUl = $('#ulList'), code = (e.keyCode ? e.keyCode : e.which); 

       if (code === 40) { //Up Arrow 
        if ((obj.length === 0) || (objUl.find('li:last').hasClass('SelectedLi') === true)) { 
         objCurrentLi = objUl.find('li:first').addClass('SelectedLi'); 
        } 
        else { 
         objCurrentLi = obj.next().addClass('SelectedLi'); 
        } 
        obj.removeClass('SelectedLi'); 
       } 
       else if (code === 38) { //Down Arrow 
        if ((obj.length === 0) || (objUl.find('li:first').hasClass('SelectedLi') === true)) { 
         objCurrentLi = objUl.find('li:last').addClass('SelectedLi'); 
        } 
        else { 
         objCurrentLi = obj.prev().addClass('SelectedLi'); 
        } 
        obj.removeClass('SelectedLi'); 
       } 

       $(this).val(objCurrentLi.text()); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <input type="text" id="region" class="inputs" name="remo" /> 
    <ul id="ulList"> 
     <li id="idr0"></li> 
     <li id="idr1">Baltimore</li> 
     <li id="idr2">India</li> 
     <li id="idr3">International - Russia</li> 
     <li id="idr4">MD 19940</li> 
     <li id="idr5">Minnesota</li> 
     <li id="idr6">North Carolina</li> 
    </ul> 
</body> 
</html>