如何使用jQuery将动态生成元素的页面元素包装起来？

Question

我有以下代码

var input = $('#el_id'); 
wrapper = $(document.createElement('div')); 
wrapper.addClass('small'); 
wrapper.css('width',200); 
input.wrap(wrapper); 

alert(input.children().length) 

我得到0为孩子长度。我想要的是：

<div class="small" style="width: 200px;"> 
    <input type="text" id="el_id" /> 
</div> 

但我想小动态生成。任何想法为什么这不起作用？

UPDATE

事实证明了我的问题在于对另一行代码。我想在包装后将包装分配给变量并且：

block = input.wrap("<div class='"+container_class+"' style='width: "+wrap_width+"px;'></div>"); 

不起作用。它返回有意义的输入。但是我怎么能返回包装？

谢谢！

Answer 1

我相信你是对的。

你只需要在保鲜功能的结果保存到一个变量：

编辑：更新的代码来获取父（）：

var wrapped = input.wrap(wrapper).parent(); 
alert(wrapped.children().length); 

Answer 2

从documentation看来，wrap（）只接受DOM元素或字符串。你传递给它一个jQuery对象，这可能无法正常工作。我想试试这个：

$('#el_id').wrap('<div class="small" style="width: 200px;"></div>'); 

Answer 3

简单。你试图用jquery对象包装而不是wrap（）函数期望的dom对象。