如何防止用户为每种情况选择单选按钮

How to prevent user from making radio button selection for each case?

本文关键字：情况 选择 单选按钮 何防止 用户      更新时间：2023-09-26

我有一个表格，其中包含两个带有单选按钮的测验问题。

例如：

问题1：美国的首都是什么。？1） NY2） 直流3） LA4） SF

问题2：谁是美国现任总统。1） 布什2） 克林顿3） 华盛顿4） 奥巴马

我启用了一个javascript，它可以防止用户在选择答案后更改选择。例如，如果我为问题1选择LA，它将被锁定，并且我不能更改为SF。

问题是javascript会导致问题2出现相同的行为，因此我无法选择问题2中的任何答案。

这是我正在使用的脚本：

      // prevent the user from making another selection once one radio option has been selected
    $('input[type=radio]').click(function(){ $('input[type=radio]').prop('disabled',true); });

你知道我如何设置这个脚本来应用于每个问题，而不是所有未回答问题的单选按钮吗？

从当前单击的单选中获取name值，然后禁用该特定组：

$('input[type=radio]').click(function() { 
    var name = $(this).attr("name");
    $("input[name=" + name + "]").prop("disabled", true);
});

问题的所有单选按钮都应该具有相同的名称。因此，将名称添加到选择器中。

$('input[type=radio]').click(function(){ $('input[type=radio][name='+$(this).attr('name')+']').prop('disabled',true); });

假设您有一个这样的表单：

<form name='questions'>
<input name='q1' type='radio' value='a' >a<br />
<input name='q1' type='radio' value='b' >b<br />
<input name='q1' type='radio' value='c' >c<br />
<br />    
<input name='q2' type='radio' value='1' >1<br />
<input name='q2' type='radio' value='2' >2<br />
<input name='q2' type='radio' value='3' >3<br />
</form>

然后使用这个脚本来实现您想要的：

$('input[type=radio]').change(function () { 
    $('input[name='+this.name+']').prop('disabled', true); 
});

将jQuery更改为：

$('input[type=radio]').click(function(){ 
    $('input[name="'+$(this).attr('name')+'"]').prop('disabled',true); 
});

在您的点击功能中使用$('input[type=radio]')将指代您想要使用$(this)来指代被点击的单选按钮的所有单选按钮。特别是$(this).attr('name')，用于抓取同一组中的单选按钮。

相关文章：