Question

好的，我正在动态创建隐藏的输入字段，如下所示：

$("<input type='hidden' id=pid'"+postid+"-title name='posts["+postid+"][title]' value='' />" +
  "<input type='hidden' id=pid'"+postid+"-body name='posts["+postid+"][body]' value='' />" +
"<input type='hidden' id=pid'"+postid+"' class='category' name='posts["+postid+"][category]' value='' />" +
"<input type='hidden' id=pid'"+postid+"' class='author' name='posts["+postid+"][author]' value='' />"
).appendTo("#datatable");

为了便于调试，我改变了标题输入的id以包括它的类（标题）。因此，似乎我应该能够使用代码$('#pid'+id+'-title')来访问它。然而，事实并非如此。相反，使用$("#pid"+id+"-title")toSource()的结果是({context:({}), selector:"#pid0-title"})。顺便说一下，0是正确的ID。

我觉得我必须遗漏一些关于JQuery和动态元素的明显信息。我显然无法找到对象的原因是什么？

Answer 1

你可以通过这种方式尝试更加清晰有序：

var createInputs = function(postid) {

    var 
        input = $('<input type="hidden" value="" />'),
        createInput = function(id, type) {
            return input.clone()
                    .addClass(type)
                    .attr('id', 'pid' + id + '-' + type)
                    .attr('name', 'posts[' + id + '][' + type + ']');
        };

    $()
        .add(createInput(postid, 'title'))
        .add(createInput(postid, 'body'))
        .add(createInput(postid, 'category'))
        .add(createInput(postid, 'autor'))
        .appendTo('#datatable');

};    

createInputs(1);

console.log($('#datatable').html());

example

Answer 2

你的ids中有引号，你也有重复的id，两者都不是有效的。请使用具有可接受字符的唯一ID（以alpha开头，可以包括数字和下划线以及可能包含的其他一些我忘记的内容）

$("<input type='hidden' id='pid"+postid+"-title' name='posts["+postid+"][title]' value='' />" +
  "<input type='hidden' id='pid"+postid+"-body' name='posts["+postid+"][body]' value='cccc' />" +
"<input type='hidden' id='pid"+postid+"-category' class='category' name='posts["+postid+"][category]' value='' />" +
"<input type='hidden' id='pid"+postid+"-author' class='author' name='posts["+postid+"][author]' value='' />").appendTo("#datatable");


 alert($("#pid1-body").val());

上面的工作在jQuery中我可以通过ID选择并获得如图所示的值，你的id中的撇号正在查杀代码。

Answer 3

您的输入未获得ID属性的值，原因是所有输入都放错了“单引号”。

请参阅此working Fiddle示例！

根据以下条件调整您的代码：

$("<input type='hidden' id='pid"+postid+"-title' name='posts["+postid+"][title]' value='' />" +
"<input type='hidden' id='pid"+postid+"-body' name='posts["+postid+"][body]' value='' />" +
"<input type='hidden' id='pid"+postid+"' class='category' name='posts["+postid+"][category]' value='' />" +
"<input type='hidden' id='pid"+postid+"' class='author' name='posts["+postid+"][author]' value='' />"
).appendTo("#datatable");

现在，元素的选择应该没有任何问题。

注意：正如@Jeff Watkins所提到的，ID上不应该有重复的document。

input.category和input.author具有相同的ID。

请参阅相关的documentation，其中包含：

... ID属性可用于唯一标识其元素。

获取动态创建的元素

3 个答案: