3

我试图使用动态选择单选按钮

$('#dashboard2 #dbMainPanel #bar2 #ddShowBar').attr('checked', true);

但这会导致form.reset()失败。由于我在页面中有很多按钮,并且我在选择时不使用表单标签

$('#dashboard1 #dbMainPanel #bar1 #ddShowBar').attr('checked', true); 

所有其他单选按钮都会重置。

如何避免这种情况?并保持页面中现有的单选按钮处于选中状态,然后动态更改当前单选按钮。

  1. 首先点击pie进入div1
  2. 然后点bar进去div2

在这种情况下,我希望pieindiv1barindiv2被选中

小提琴

小提琴2

4

2 回答 2

3

你试过使用.prop()吗?

$('#ddShowBar').prop('checked', true);

http://api.jquery.com/prop/

属性与属性

属性和属性之间的区别在特定情况下可能很重要。在 jQuery 1.6 之前,.attr() 方法在检索某些属性时有时会考虑属性值,这可能会导致行为不一致。从 jQuery 1.6 开始,.prop() 方法提供了一种显式检索属性值的方法,而 .attr() 检索属性。 例如,应使用 .prop() 方法检索和设置 selectedIndex、tagName、nodeName、nodeType、ownerDocument、defaultChecked 和 defaultSelected。在 jQuery 1.6 之前,可以使用 .attr() 方法检索这些属性,但这不在 attr 的范围内。这些没有对应的属性,只是属性。

还有更多:在您的示例中,您正在生成多个ID元素并重复 attr:您的无线电组的名称
每个新组都需要name与前一组不同的收音机。使用犁刀c变量可以轻松实现:

在此示例中,第一组中的收音机将具有以下名称txtradio0:比下一组收音机:txtradio1等...

要保持选中的其他行无线电,您只需更改组 NAME 属性:

演示

var r = ['Pie','Bar','Line','Area','Scatter'];
var c = 0;  // a group counter // set to 1 if you want

function populateWithRadio(){

    var rB = "<div class='radiobuttons'>";
    for(var i=0; i< r.length; i++){         // create radios
        rB += "<input type='radio' class='ddShow"+ r[i] +"' name='txtradio"+ c +"' value='"+r[i]+"'/>"+ r[i] ;
    }
    rB += "</div></br></br>";

    c++;                         // increase Group counter 
    return rB;                   // returns the generated HTML to append
}


$('#div1').append( populateWithRadio() );
$('#div2').append( populateWithRadio() );

$(document).on("click", '.radiobuttons input', function () {
    alert( 'CLASS: '+ this.className +'\n NAME: '+ this.name );
});
于 2013-08-13T14:48:59.367 回答
1

AFAIK,收音机按“名称”HTML 属性分组。因此,您只需为每个无线电组设置唯一的名称,然后只能同时选择组中的一个无线电。否则(如果收音机没有按逻辑分组)你最好使用复选框。

于 2013-08-13T14:52:26.217 回答