复选框和标签即时创建

时间:2013-03-25 02:49:35

标签: jquery dom appearance on-the-fly

当我使用jQuery“动态”创建一个复选框和一个标签时,它的功能很好(即:如果我单击标签,选中复选框),但浏览器的默认视觉外观分配给标签与为非动态创建的标签分配的默认视觉外观不同。

[x] normal label
[x]label created on the fly

差异是标签和复选框之间的空格(边距)。

关于这里发生了什么的任何想法?

动态复选框/标签创建的代码如下:

 $('<input type="checkbox" id="foo"/><label for="foo">bar</label>')

动态复选框/标签创建的代码如下:

 <input type="checkbox" id="baz"/><label for="baz">quz</label>

1 个答案:

答案 0 :(得分:1)

这是发生的事情: http://jsfiddle.net/kSjJZ/

 <body>
     <ul id="bla">
         <li>
             <input type="checkbox" id="baz"/><label for="baz">quz</label>
         </li>
         <li>
             <input type="checkbox" id="foo"/>
             <label for="foo">quz</label>
         </li>
     </ul>
 </body>

基本上,如果这两个标签(输入和标签)由\ r \ n

分隔,则会有空格解释