radio Buttons and .attr('checked','checked') does NOT work in IE7

问题

Is there any way to get radio buttons checked upon appending in IE7?

What seems to work in every browser, doesn't look like it works in IE6,7 despite reading everywhere that I'm doing it correctly. I have absolutely no idea why it's not working.

var $itemVariantRowRadio = $("<input/>")
    .attr("type", "radio")
    .attr("name", "itemvariant")
    .addClass("itemvariant")
    .val('whatever');


    $itemVariantRowRadio.attr('checked', 'checked');
    $itemVariantRow.append($itemVariantRowRadio)

Now if I do a console.log($itemVariantRowRadio.attr('checked') in IE6/7 then it says that it's set to TRUE but the radio doesn't actually get checked or pick up as checked.

Nightmare! Anyone else come across this and have any sort of fix?

回答1:

If in jQuery >= 1.6:

Use prop as seen here: .prop() vs .attr()

$itemVariantRowRadio.prop('checked', true);

If in jQuery < 1.6:

$itemVariantRowRadio.attr('checked', true);

ALSO:

Try creating your element like so:

var $itemVariantRowRadio = $("<input/>",{
     type: 'radio',
     name: 'itemvariant',
     class: 'itemvariant',
     checked: true,
     value: 'whatever'
});
$itemVariantRow.append($itemVariantRowRadio);

See fiddle: http://jsfiddle.net/maniator/6CDf3/
An example with 2 inputs appended: http://jsfiddle.net/maniator/6CDf3/2/

回答2:

Try: $itemVariantRowRadio.not(':checked').click().change();

So you actually click the checkbox just like you would do as a user with the mouse. not(':checked') will get you sure it was not already checked before. And trigger the change event afterwards, as jQuery click does not do that by itself.

回答3:

MSIE doesn't allow you to change the type of an input element once it has been created.

See http://bugs.jquery.com/ticket/1536 and http://api.jquery.com/jQuery/#jQuery2

Just create it so:

$('<input type="radio">')

回答4:

You don't need to trigger the click event if you apply the checked attribute after you append it to the dom: http://jsfiddle.net/XjHUe/2/

<div id='content'></div>
var $itemVariantRowRadio = $("<input/>")
    .attr("type", "radio")
    .attr("name", "itemvariant")
    .addClass("itemvariant")
    .val('whatever');
//$itemVariantRowRadio.attr("checked", true);
$("#content").append($itemVariantRowRadio);
$(".itemvariant").attr('checked',true);

var val = $(".itemvariant").attr("checked");
alert(val);

来源：https://stackoverflow.com/questions/6432246/radio-buttons-and-attrchecked-checked-does-not-work-in-ie7

标签

jquery

internet-explorer-7

radio-button