Question

在上图中。我想搜索文本取决于类别。我想用键盘选择单选按钮来选择类别。

这是我的关键听众来自控制器。 SELECT是指键盘上的ENTER键。我尝试了下面的代码，使用单选按钮ID，但它选择了第一个单选按钮。任何人都可以帮助我...

case PV.yoohu.appConstants.keyCodes.SELECT:                
    if (searchPageRadioButtonCtrl) {
       document.getElementById("searchFilternames").checked = true;
    }
  break;
case PV.yoohu.appConstants.keyCodes.BACK:
  break;
case PV.yoohu.appConstants.keyCodes.RIGHT:
  break;
case PV.yoohu.appConstants.keyCodes.LEFT:
  break;
case PV.yoohu.appConstants.keyCodes.DOWN:
  break;
case PV.yoohu.appConstants.keyCodes.UP:
  break;

我的html生成了单选按钮。单选按钮的ID是＆＃34; searchFilternames＆＃34;

<div id="searchCategory">
  <div id="searchFilter" ng-repeat="item in searchFilters">
    <input id="searchFilternames"type="radio" ng-model="selectedFilter.name"
       value="{{item.name}}" ng-class="{'selectedRadioButtonborder': isRadioFocussed($index)}"
       yo-attr="{html : 'item.name'}"/><span ng-bind="item.name"></span>
  </div>
</div>

这是单选按钮的方法。

$scope.isRadioFocussed = function (index){
        if (index == searchPageRadioButtonCtrl) return true;
        else return false;
    };

[！[在此处输入图片说明] [2]] [2] 在上面的图像中，我需要将控制器带到下一个单选按钮，因为我正在使用searchPageRadioButtonCtrl

http://i.stack.imgur.com/cSWML.png

Answer 1

首先，您必须将name属性添加到您的无线电以使它们互斥，然后您可以使用以下代码

case PV.yoohu.appConstants.keyCodes.SELECT:                

   var radios = document.getElementById('searchFilter').getElementsByTagName('input');
   for(var i=0;i<radios.length;i++)
   {
       var radio = radios[i]
       if(radio.type=='radio')
       {
            if(radio.checked)
            {

                if(radios.length>i+1)
                {
                    var radioNext = radios[i+1];
                    radioNext.checked=true;
                    break;
                 }
                 else
                 {
                     radios[0].checked=true;
                     break;
                  }

               }
           }
      }
break;

<强> Example Fiddle

如何使用键盘上的ENTER键选择单选按钮

1 个答案: