Question

这似乎很简单，我不知道这是一个错误，还是我做错了。

我想要做的是在jquery中构建一个复选框输入，然后返回输入的字符串。我有这段代码：

var obj = $('<input>');
obj.attr('disabled', 'disabled');
obj.attr('type', 'checkbox');
obj.attr('checked', 'checked'); // this does not work!

无论我如何尝试渲染此obj，“已检查”属性都不会被输出。

所以我尝试过：

$('<div>').append(obj).remove().html();

然后它返回：

<input type="checkbox" disabled="disabled" />

我尝试过设置id属性，但没有区别。我也尝试了这个，但它不起作用：

obj.attr('checked', true);

有关如何使用checked属性设置为'checked'（通过jquery）获取输入标记的任何建议？

我意识到我可以用字符串连接来做这件事，但现在我真的想知道为什么它不按预期的方式工作。

修改

你可以在萤火虫中尝试这个。以我的方式或 cletus '的方式创建obj，然后尝试将其渲染为字符串。你会发现'checked'属性永远不会被渲染。

Answer 1

这对我有用：

$("<input>").attr({
  type: "checkbox",
  disabled: true,
  checked: true
}).appendTo("body");

在FF 3.6，Chrome 4和IE 8（compat）中测试过。

Answer 2

你是对的，“checked”属性有一些奇怪之处。它似乎只有在浏览器实际呈现后才会生效。（而不仅仅是在片段中。）

例如，使用您的代码，

var obj = $('<input />');
obj.attr('disabled', 'disabled');
obj.attr('type', 'checkbox');
obj.attr('checked', 'checked');
var wrapper = $('<div />').append(obj);
alert(wrapper.html());       // notice, no checked attr in this string...
$('body').prepend(obj);      // but now notice, it IS checked when it's drawn!

我知道这本身并不是一个“答案”，但是想让你知道你不会疯狂。我也很想知道为什么会这样。

祝你好运！

Answer 3

~~您是否尝试过~~

~~obj.attr('checked');~~

不是试图变得滑稽。只是真的想知道它是否为他做了什么。

我猜你是对的。我从来没有考虑过它，因为jQuery在:checked选择器中有一个内置的解决方法，所以它从来都不是一个问题。

Answer 4

我知道的唯一方法是允许你返回整个HTML对象作为字符串将使用outerHTML技巧：

jQuery.fn.outerHTML = function () {
    return $('<div>').append(this.eq(0).clone()).html();
};

然后，只需

$("<input>").attr({
  type: "checkbox",
  disabled: true,
  checked: true
}).outerHTML();

会给你完整的字符串。

构建jquery复选框 - 无法设置选中的值

4 个答案: