jQuery包装div

Question

我需要的是将HTML包装在当前div周围，这是我到目前为止所得到的：

HTML：

<input type="text" data-placeholder="username" />

需要呈现为：

<div class="placeholding-input">
  <input type="text" data-placeholder="username" />
  <label>Username</label>
</div>

到目前为止我得到了什么：

$.each($('input[type="text"], input[type="password"], textarea'), function(){
    var input = $(this);
    var container = $('<div />').addclass('placeholding-input');
    input.wrap(container);
    var label = $('<label />').html(input.data('placeholder')).appendTo(container);
});

但由于某种原因，这不起作用，我不知道为什么。

感谢您的帮助：）

Answer 1

var container = $('<div />').addclass('placeholding-input');

要：

var container = $('<div />').addClass('placeholding-input');
//                              ^--------------------- upperCase

完整代码：

$('input[type="text"], input[type="password"], textarea').each(function() {
    var input = $(this);
    var container = $('<div>').addClass('placeholding-input');
    var label = $('<label>').html(input.data('placeholder'));
    input.wrap(container).after(label);
});​

DEMO

Answer 2

尝试如下，

$(function() {
    $.each($('input[type="text"], input[type="password"], textarea'), function() {    
        var input = $(this);
        var container = $('<div />').addClass('placeholding-input');
        var label = $('<label />').html(input.data('placeholder'));
        input.wrap(container).after(label);
    });
});

DEMO： http://jsfiddle.net/skram/CsGUv/

Answer 3

var input = $(this).wrap((container = $('<div />').addClass('placeholding-input')));
input.after((label = $('<label />').html(input.data('placeholder'))));

完成，感谢您的帮助：）

Answer 4

$.each($('input[type="text"], input[type="password"], textarea'), function(){
    var input = $(this);
    var container = $('<div />').addClass('placeholding-input'); // not addclass
    var label = $('<label />').html(input.data('placeholder'));
    input.wrap(container).after(label);
});

<强> DEMO

Answer 5

除addclass中的语法错误外，在包装输入之前将标签附加到div。

http://jsfiddle.net/Yb9QV/

$.each($('input[type="text"], input[type="password"], textarea'),
       function(){
            var input = $(this);
            var container = $('<div />').addClass('placeholding-input');

            var label = $('<label />')
                .html(input.data('placeholder')).appendTo(container);

            input.wrap(container);
});​