創建輸入框使用jQuery

Question

我想創建一個標籤，放置外輸入複選框拉布勒裏面，像

我試圖這樣，我的HTML是

<input type="checkbox"> 

我jQuery是

$('input[type="checkbox"]').after('<label class="label-select"><span></span></label>'); 

現在的輸出是

<input type="checkbox"> 
<label class="label-select"> 
<span></span> 
</label> 

但我想這樣

<label class="label-select"> 
<input type="checkbox"> 
<span></span> 
</label> 

那麼怎麼可能我寫的jQuery這一點。我不想更改HTML。

感謝您的回答。

Answer 1

使用wrap()不after()：

$('input[type="checkbox"]').wrap('<label class="label-select"></label>').after('<span></span>'); 

Example fiddle

Answer 2

您正在尋找.wrap() jQuery函數。

Answer 3

如果你使用jQuery.wrap（），你應該能夠實現你正在尋找的東西。

$('input[type="checkbox"]').after('<span></span>').wrap('<label class="label-select"></label>'); 

編輯 拿到了兩回前對不起，應該是

$('input[type="checkbox"]').wrap('<label class="label-select"></label>').after('<span></span>'); 

Answer 4

試試這個：

$('input[type="checkbox"]').wrap('<label class="label-select"></label>').wrap('<span></span>'); 

Answer 5

或者你可以使用jQuery的append（）方法來追加HTML在一個塊內。試試這個，

$('.label-select').append('<input type="checkbox"><span></span>'); 

Answer 6

您只需將元素（複選框）包裝在標籤內。

$('input[type="checkbox"]').wrap('<label class="label-select"><span></span></label>');