jQuery单选按钮-只选择一个?
这可能是一个愚蠢的简单问题,但我被卡住了 我创建了一个带有多个复选框的表单,当单击复选框时,它会将每个复选框的值作为逗号分隔的列表传递给一个隐藏的输入字段。这是一种享受。但是由于一些问题,我现在不得不修改我的代码,让它改用单选按钮——这样就没有逗号分隔的值列表,一次只有一个值 我修改了代码,将其替换为单选按钮,除了两件事外,它工作正常:1)它没有在单选按钮之间切换(每次我选择一个按钮时,它保持选中状态,就像我选择其他按钮一样);2)它添加到列表中,而不是返回选中的单个选项。换句话说,它仍然像一个复选框,除了视觉上,它是圆的,有一个点。哈哈 这是我迄今为止的代码:jQuery单选按钮-只选择一个?,jquery,forms,Jquery,Forms,这可能是一个愚蠢的简单问题,但我被卡住了 我创建了一个带有多个复选框的表单,当单击复选框时,它会将每个复选框的值作为逗号分隔的列表传递给一个隐藏的输入字段。这是一种享受。但是由于一些问题,我现在不得不修改我的代码,让它改用单选按钮——这样就没有逗号分隔的值列表,一次只有一个值 我修改了代码,将其替换为单选按钮,除了两件事外,它工作正常:1)它没有在单选按钮之间切换(每次我选择一个按钮时,它保持选中状态,就像我选择其他按钮一样);2)它添加到列表中,而不是返回选中的单个选项。换句话说,它仍然像一个
jQuery(document).ready(function($) {
$(':radio').click(function() {
var radio = $(this);
var text = $('input[name="cat"]');
if(radio.is(':checked')) {
text.val(text.val() + radio.val());
//alert(text.val());
} else {
text.val(function() {
$(this).val().replace(radio.val(),"");
});
}
});
});
因此,当我取消注释该“警报”行时,我可以看到传递的内容,它只是添加到列表中,而不是替换为新值。有人知道如何修复上述问题,以便只能选择和传递一个选项吗?(上面的代码作为一个复选框非常有效。我实际上认为我从这里的某个地方得到了上面的代码,尽管我不记得在哪里!)
编辑:这里的代码解决了这个问题,效果不错(感谢大家:)-也许它将来会帮助其他人
`jQuery(document).ready(function($) {
$(':radio').change(function() {
var radio = $(this);
var text = $('input[name="cat"]');
if(radio.is(':checked')) {
text.val(radio.val());
//alert(text.val());
} else {
text.val(function() {
$(this).val().replace(radio.val(),"");
});
}
});
});`
这是做同样事情的简单方法:假设无线电组名=
a
$("input[name='a']").change(function(){
alert($(this).val());
});
对于演示:这是做同样事情的更简单方法:假设无线电组名=
a
$("input[name='a']").change(function(){
alert($(this).val());
});
对于演示:单选按钮必须具有相同的名称属性。id属性可以不同,但相同的名称属性允许您一次只选择一个。单选按钮必须具有相同的名称属性。id属性可以不同,但相同的name属性允许您一次只选择一个。好的,您将“text”元素的值设置为其当前值加上所选单选按钮的值。要删除以前的单选按钮值,您必须根据某种模式将其删除,或者将文本输入的原始值隐藏在某个位置,以便重新构建它
如果你的单选按钮不像单选按钮,那是因为你没有给它们起相同的名字。这就是单选按钮的工作原理:在共享名称的按钮中,最多可以随时选择一个。好的,您将“text”元素的值设置为其当前值加上所选单选按钮的值。要删除以前的单选按钮值,您必须根据某种模式将其删除,或者将文本输入的原始值隐藏在某个位置,以便重新构建它
如果你的单选按钮不像单选按钮,那是因为你没有给它们起相同的名字。这就是单选按钮的工作原理:在共享名称的按钮中,最多可以在任何时候选择一个。您的代码无法使用单选框,因为它假定您单击复选框以取消选中它。对于单选框,您不必单击某个框来取消选中它,只需选择另一个单选框,这样就不会调用从隐藏字段中删除未选中框值的函数
当然,你可以修改你的代码来使用无线盒子,但我认为这是没有必要的:无线盒子的默认行为是将所选盒子的值传递给服务器,因此,您不必将其值复制到隐藏字段。您的代码无法使用单选框,因为它假定您单击复选框以取消选中它。对于单选框,您不必单击某个框来取消选中它,只需选择另一个单选框,这样就不会调用从隐藏字段中删除未选中框值的函数
当然,你可以修改你的代码来使用收音盒,但我认为这是没有必要的:收音盒的默认行为是将所选框的值传递给服务器,因此你不必将其值复制到隐藏字段。我想这就是你想要的:
jQuery(document).ready(function($) {
$(':radio').click(function() {
var radio = $(this);
var text = $('input[name="cat"]');
removeRadioValues()
text.val(text.val()+radio.val());
});
});
function removeRadioValues(){
var tf = $('input[name="cat"]');
var text = tf.val()
$(':radio').each(function(){
text = text.replace($(this).val(),'');
});
tf.val(text);
}
我想这就是你想要的:
jQuery(document).ready(function($) {
$(':radio').click(function() {
var radio = $(this);
var text = $('input[name="cat"]');
removeRadioValues()
text.val(text.val()+radio.val());
});
});
function removeRadioValues(){
var tf = $('input[name="cat"]');
var text = tf.val()
$(':radio').each(function(){
text = text.replace($(this).val(),'');
});
tf.val(text);
}
为所有收音机设置相同的
name
html属性时,只能选择一个。下面是我用来设置单选按钮和选择用户选择值的示例
参考
代码
李贺
案例
工作点
切洛特
月岩
$(文档).ready(函数()
{
//将扫描类型单选按钮添加为表格行
var cardTemplate=$(“#cardTemplate”).html();
$('#tblPlantParameters tr:last')。在(cardTemplate)之后;
//当扫描类型单选按钮选择更改时,在隐藏字段中设置值
$('input[name=defaultScanOption]:radio')。更改(函数()
{
var selectedOptionValue=$(this.val();
警报(选择选项值);
$('hidselectedscanpoption').val(selectedOptionValue);
});
//如果扫描类型单选按钮的值不是默认值,则设置该按钮
var existingDefaultScanType=document.getElementById('HideExistingScanOption')。值;
警报(existingDefaultScanType);
如果(existingDefaultScanType!=null&&existingDefaultScanType!=“”)
{
$(“输入[name=defaultScanOption][value=“+existingDefaultScanType+”]”)attr('checked',true);
}
});
当您为所有收音机设置相同的名称
html属性时,您只能选择一个。下面是我用来设置单选按钮和选择用户选择值的示例
参考
代码
丽晶