jQuery mobile 中的多个单选按钮控件组

Posted 2023-05-09

【中文标题】jQuery mobile 中的多个单选按钮控件组

【英文标题】：Multiple radio buttons controlgroups in jQuery mobile

【发布时间】：2019-04-23 01:34:39

【问题描述】：

我有下面的html代码

<fieldset id="a">
<input type="radio" name="choice1" value="1" radioatrr="0" class="myvalue1" /><label for="choice1">text 1</label> 
<input type="radio" name="choice2" value="2" radioatrr="0" class="myvalue2" /><label for="choice2">text 2</label>
<input type="radio" name="choice3" value="3" radioatrr="0" class="myvalue3" /><label for="choice3">text 3</label>
</fieldset>
<fieldset id="b">
<input type="radio" name="cb-choice1" value="4" radioatrr="1" class="myvalue4" /><label for="cb-choice1">text 4</label> 
<input type="radio" name="cb-choice2" value="5" radioatrr="1" class="myvalue5" /><label for="cb-choice2">text 5</label>
</fieldset>

如果选择了choice2 并且cb-choice1 或cb-choice2 之一被选中，那么如果选中了choice2 并且没有cb-...检查然后收到的值为2。

我该怎么做？

我试试这个

$("input:checked").each(function(i) 
   if (($(this).attr("radioatrr") == 0)) 
      alert(($(this).attr("value"));
   
)

但不能按我的意愿工作

【问题讨论】：

你用js尝试过什么吗？有的话可以分享一下吗？

你的问题也不清楚。包括预期结果

【参考方案1】：

您可以查看 W3 中的本教程来帮助您： https://www.w3schools.com/jsref/prop_radio_value.asp

关于你的问题，你可以挂上这个函数：

function handleRadioselection() 
    if(document.getElementByName('choice2').checked) 
        if (document.getElementByName('cb-choice1').checked) 
            return document.getElementByName('cb-choice1').value
         else if (document.getElementByName('cb-choice2').checked) 
            return document.getElementByName('cb-choice2').value
         else 
            return document.getElementByName('choice2').value
        
    

【参考方案2】：

我正在使用隐藏的输入字段来捕获您想要的值，您可以将其更改为其他任何值。我还将单选按钮修改为两组，从阅读问题/要求开始，我认为应该是这样设置的。

$("#submit").click(function() 
  //capture group 1 and group 2 value that's checked
  var val1 = $('input[name=choice]:checked').val();
  var val2 = $('input[name=choice2]:checked').val();
  
  //capture the input object with the desired value
  var sendVal = $('input[name=myval]');
  
  //reset value to 0 as this happens on click, incase value gets changed
  sendVal.val(0);
  
  //if group 1 is 2 and there is a value selected in group2
  if(val1==2&&val2 != undefined)
    sendVal.val(val2);
    
  //if group 1 is 2 and group 2 is not selected
  else if(val1==2&&val2 == undefined)
    sendVal.val(val1);
  
  
  //showing value to be sent in an alert
  alert(sendVal.val());
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Group 1</h2>
<input type="radio" name="choice" value="1" class="myvalue1" /><label for="choice1">text 1</label> 
<input type="radio" name="choice" value="2" class="myvalue2" /><label for="choice2">text 2</label>
<input type="radio" name="choice" value="3" class="myvalue3" /><label for="choice3">text 3</label>

<h2>Group 2</h2>
<input type="radio" name="choice2" value="4" class="myvalue4" /><label for="cb-choice1">text 4</label> 
<input type="radio" name="choice2" value="5" class="myvalue5" /><label for="cb-choice2">text 5</label>

<input type="hidden"name="myval" value="0">
<br/>
<button id="submit">submit</button>