Safari Ajax 错误?检查无线电未检查 [英] Safari Ajax bug? checked radio not checked

问题描述

在 Safari 中，如果我通过 XHR (ajax) 加载一段 html，则浏览器不会呈现已选中的 checked="checked" 属性的单选按钮.

In Safari, If I load a piece of html via XHR (ajax) the browser does not render the radio button that has the checked="checked" attribute as checked.

我通过ajax获取的html:

the html I fetch via ajax:

<input type="radio" name="radiotest" value="off">
<input type="radio" name="radiotest" value="on" checked="checked">

浏览器呈现两个未选中的单选按钮.如果我直接从纯 html 文件(无 ajax)加载完全相同的代码，单选按钮将按应有的方式呈现，最后一个处于选中状态.

the browser renders two unchecked radio buttons. If I load the exact same code directly from a plain html file (no ajax) the radio buttons render as they should, the last being in its checked state.

怎么了，这是一个已知的错误吗?有修复吗?

what's wrong, is this a known bug? Is there a fix available?

进一步探索这看起来像是一个浏览器错误，到目前为止我无法使用 jQuery Post 处理来修复它，感谢任何帮助......这是我发现的:

Probing further this looks like a browser bug, and I could not so far fix it with jQuery Post processing, any help appreciated.. here is what I've found:

我有一个页面，它通过 ajax 拉入一些表单元素.html是这样的:

I have a page that pulls in some form element via ajax. The html is this:

<input type="checkbox" name="checktest">
<input type="checkbox" name="checktest" checked="checked">

<input type="radio" name="radiotest" value="off">
<input type="radio" name="radiotest" value="on" checked="checked">

在表单元素被拉入后，复选框呈现正确，但收音机都呈现未选中.现在，如果我运行以下 jQuery 命令(来自 Safari 5 控制台):

after the form element are pulled in, the checkboxed render correct, but the radios both render unckecked. Now, If i run the following jQuery command (from the Safari 5 console):

$('#activemodules input[checked="checked"]');

..它返回一个包含选中复选框的对象.

..it returns an object containing the one checked checkbox.

但是如果我运行命令:

$('#activemodules input[value="on"]');

它实际上重新调整了正确的对象，它甚至像这样正确地显示了其 outerHTML 属性:

it actually retuns the correct object, and it even shows its outerHTML property correct like this:

outerHTML: "<input type="radio" name="radiotest" value="on" checked="checked">"

现在，如果我这样做:

 $('#activemodules input[value="on"]').attr('checked','checked');

Safari 得到它，并正确呈现它.我想我只需要传递一个 data-ischecked="true" 属性，并在加载 ajax 位后使用它来捕获和重新检查"所有单选按钮..但是，即使我可以做到这一点，我想听听对此的任何意见或建议.

Safari get's it, and renders it correctly. I guess I'll just have to pass a data-ischecked="true" attribute and use that to catch and 're-check' all radio buttons after the ajax bit is loaded.. but still, even if I can do this, I'd like to hear any comment or suggestions on this.

推荐答案

我的解决方案是这样结束的:

This is what my solutions ended like:

首先，我向被检查的无线电添加一个 data-ischecked="1" 属性:

First I add a data-ischecked="1" attribute to the radios that are checked:

<input type="radio" name="foo" data-ischecked="1" value="bar" checked="checked">

然后，在 ajax 调用成功并完成后，我运行这个:

then, after the ajax call succeeds and finishes I run this:

$('#myradios :radio')
.each(function(){
    if( $(this).data('ischecked') ){
        $(this).attr('checked','checked');
        $(this).removeAttr('data-ischecked');
    }
});

这似乎工作正常......但我发现了一些其他重要的东西:

This seems to work fine.. but I found out some other stuff of importance:

如果我简单地将数据属性称为数据检查而不是数据检查它不起作用，也许这是一个保留名称?

If I called the data attribute simply data-checked instead of data-ischecked it DID NOT WORK, maybe this is a reserved name?

还有;如果我在更广泛的选择器范围内运行操作:

And also; if I ran the operation on the broader selector scope:

$(':radio')
    .each ...

然后它也不起作用

我不知道为什么，但是添加广播的父元素的 id，该元素也是 ajax 调用返回的 html 的一部分，如下所示:

I don't know why, but adding the id of a parent element of the radios that was also part of the html returned by the ajax call to the selecor scope like this:

$('#myradios :radio')

让它工作..

这篇关于Safari Ajax 错误?检查无线电未检查的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！