如何获取2个不同的无线电盒的值并使用loop / each将其设置到特定的位置？

时间：2017-06-07 14:34:11

标签： jquery jradiobutton

＆＃13;
＆＃13; 
$(document).ready(function() {


  $('.allrb').change(function() {
    valueE();
  });

});  


function valueE()
{
  for(j=0; j<=2 ; j++)
  {
    var nofr1=[];  
    row=document.getElementsByName("Fr"+j);
      for (i=0; i<row.length; i++)
      {
        if(row[i].checked)
          nofr1[i]= parseInt(row.value);
      }
    $("#numFr"+(j+1)).val(nofr1[j]); 
  }
}
＆＃13; 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-hover table-responsive" id="tab">
<tr id="alertr1" name="v">
  <td width="200px" id="text">content 1</td>
  <td width="40px"><label><input type="radio" name="Fr1" class="allrb" value="0"></label></td>
  <td width="40px"><label><input type="radio" name="Fr1" class="allrb" value="1"></label></td>
  <td width="40px"><label><input type="radio" name="Fr1" class="allrb" value="2"></label></td>
  <td width="40px"><label><input type="radio" name="Fr1" class="allrb" value="3"></label></td>
  <td width="30px"><label><input type="radio" name="Fr1" class="allrb" value="4"></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb" value="0" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb" value="1" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb" value="2" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb" value="3" ></label></td>
  <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb" value="4" ></label></td>
  <td width="30px"><input type="number" name="numFr1" id="numFr1" disabled></td>
  <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr1" id="numIr1" disabled></td>
</tr>

<tr id="alertr2" name="v">
  <td width="200px" id="text">content 2</td>
  <td width="40px"><label><input type="radio" name="Fr2" class="allrb" value="0"></label></td>
  <td width="40px"><label><input type="radio" name="Fr2" class="allrb" value="1"></label></td>
  <td width="40px"><label><input type="radio" name="Fr2" class="allrb" value="2"></label></td>
  <td width="40px"><label><input type="radio" name="Fr2" class="allrb" value="3"></label></td>
  <td width="30px"><label><input type="radio" name="Fr2" class="allrb" value="4"></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb" value="0" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb" value="1" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb" value="2" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb" value="3" ></label></td>
  <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb" value="4" ></label></td>
  <td width="30px"><input type="number" name="numFr2" id="numFr2" disabled></td>
  <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr2" id="numIr2" disabled></td>
</tr>

<tr id="alertr3" name="v">
  <td width="200px" id="text">content 3</td>
  <td width="40px"><label><input type="radio" name="Fr3" class="allrb" value="0"></label></td>
  <td width="40px"><label><input type="radio" name="Fr3" class="allrb" value="1"></label></td>
  <td width="40px"><label><input type="radio" name="Fr3" class="allrb" value="2"></label></td>
  <td width="40px"><label><input type="radio" name="Fr3" class="allrb" value="3"></label></td>
  <td width="30px"><label><input type="radio" name="Fr3" class="allrb" value="4"></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3" class="allrb" value="0" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3" class="allrb" value="1" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3" class="allrb" value="2" ></label></td>
  <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3" class="allrb" value="3" ></label></td>
  <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3" class="allrb" value="4" ></label></td>
  <td width="30px"><input type="number" name="numFr3" id="numFr3" disabled></td>
  <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr3" id="numIr3" disabled></td>
</tr>

</tbody>
</table>
＆＃13;
＆＃13;
＆＃13;

在一行中，我有2个不同的收音机盒，如何获取所有收音机盒的值并在那里设置特定input[type=number]的值？由于我有16行，每行有2个不同的值框，我想使用循环将所有值循环到特定的位置，否则会有很多冗余代码。我试过这样做，但我的jquery不会工作。感谢。

2 个答案:

答案 0 :(得分：1)

可以在事件中引用已更改的元素。如果您要输入要更新公共类的输入，则可以通过查找无线电父级tr并在其中查找该类来找到与您的无线电相关的输入。

$(document).ready(function() {
  $('.allrb').change(valueE);
});


function valueE(e) {
  var newValue = e.target.value;
  var $radio = $(e.target);
  
  if ($radio.is('.Fr')) {
    $radio.closest('tr').find('.numFr').val(newValue);
  } else {
    $radio.closest('tr').find('.numIr').val(newValue);
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-hover table-responsive" id="tab">
  <tr id="alertr1" name="v">
    <td width="200px" id="text">content 1</td>
    <td width="40px"><label><input type="radio" name="Fr1" class="allrb Fr" value="0"></label></td>
    <td width="40px"><label><input type="radio" name="Fr1" class="allrb Fr" value="1"></label></td>
    <td width="40px"><label><input type="radio" name="Fr1" class="allrb Fr" value="2"></label></td>
    <td width="40px"><label><input type="radio" name="Fr1" class="allrb Fr" value="3"></label></td>
    <td width="30px"><label><input type="radio" name="Fr1" class="allrb Fr" value="4"></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb Ir" value="0" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb Ir" value="1" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb Ir" value="2" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb Ir" value="3" ></label></td>
    <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir1" class="allrb Ir" value="4" ></label></td>
    <td width="30px"><input type="number" name="numFr1" class="numFr" id="numFr1" disabled></td>
    <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr1" class="numIr" id="numIr1" disabled></td>
  </tr>

  <tr id="alertr2" name="v">
    <td width="200px" id="text">content 2</td>
    <td width="40px"><label><input type="radio" name="Fr2" class="allrb Fr" value="0"></label></td>
    <td width="40px"><label><input type="radio" name="Fr2" class="allrb Fr" value="1"></label></td>
    <td width="40px"><label><input type="radio" name="Fr2" class="allrb Fr" value="2"></label></td>
    <td width="40px"><label><input type="radio" name="Fr2" class="allrb Fr" value="3"></label></td>
    <td width="30px"><label><input type="radio" name="Fr2" class="allrb Fr" value="4"></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb Ir" value="0" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb Ir" value="1" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb Ir" value="2" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb Ir" value="3" ></label></td>
    <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir2" class="allrb Ir" value="4" ></label></td>
    <td width="30px"><input type="number" name="numFr2" class="numFr" id="numFr2" disabled></td>
    <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr2" class="numIr" id="numIr2" disabled></td>
  </tr>

  <tr id="alertr3" name="v">
    <td width="200px" id="text">content 3</td>
    <td width="40px"><label><input type="radio" name="Fr3" class="allrb Fr" value="0"></label></td>
    <td width="40px"><label><input type="radio" name="Fr3" class="allrb Fr" value="1"></label></td>
    <td width="40px"><label><input type="radio" name="Fr3" class="allrb Fr" value="2"></label></td>
    <td width="40px"><label><input type="radio" name="Fr3" class="allrb Fr" value="3"></label></td>
    <td width="30px"><label><input type="radio" name="Fr3" class="allrb Fr" value="4"></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3 Ir" class="allrb" value="0" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir Ir3" class="allrb" value="1" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3 Ir" class="allrb" value="2" ></label></td>
    <td width="50px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3 Ir" class="allrb" value="3" ></label></td>
    <td width="120px" bgcolor="Gainsboro"><label><input type="radio" name="Ir3 Ir" class="allrb" value="4" ></label></td>
    <td width="30px"><input type="number" name="numFr2" class="numFr" id="numFr2" disabled></td>
    <td width="30px" bgcolor="Gainsboro"><input type="number" name="numIr3" class="numIr" id="numIr3" disabled></td>
  </tr>

  </tbody>
</table>

答案 1 :(得分：1)

这应该适合您，而无需更改HTML：

while true do
  io.write("PIN: ")
  local pin = tonumber(io.read("*line"))
  if pin == 21171 then
      -- code
  elseif pin == 21172 then
      -- code
  end -- if
end -- while

但是，这不适用于您最后一行的第一个广播组，因为您输入的内容为$(document).ready(function() { $('.allrb').change(valueE); }); function valueE(e) { var index = $(this).closest("tr").index(); var newValue = e.target.value; if ($(this).closest("td").attr("bgcolor") == "Gainsboro"){ $("#numIr" + (index + 1)).val(newValue); }else $("#numFr" + (index + 1)).val(newValue); } ，我认为您打算将其标记为id="numFr2"一旦您更正名称，它就会也为那个人工作。

相关问题
最新问题