jQuery - 動態添加CSS到HTML（令人費解）

我有一個「添加另一個字段」的用戶，以防他們需要添加更多的成分。該字段通過jquery動態添加。以下是默認字段的圖片和添加此字段的代碼;jQuery - 動態添加CSS到HTML（令人費解）

創建類似的元素添加一個字段

var element_ing = $('<div class="f-row ingredient">\ 
         <div class="medium">\ 
          <input type="text"/>\ 
         </div>\ 
         <div class="quantity">\ 
          <input type="text"/>\ 
         </div>\ 
         <div class="to">to</div>\ 
         <div class="quantity">\ 
          <input type="text"/>\ 
         </div>\ 
         <div class="small">\ 
          <select id="unit-dyn">\ 
          </select>\ 
         </div>\ 
         <div class="less-medium">\ 
          <select id="prep-method-dyn">\ 
          </select>\ 
         </div>\ 
         <button class="remove" id=remove-ing"></button></div>');

一切運作良好，但是當模板呈現的格式是有點過了，像這樣的;

我發現這是因爲渲染的模板添加了一個span和div類，它不在模板中，但我猜是自動添加的，而添加動態字段時會添加相同的span; HTML的默認渲染場

<div class="small" id="unit"> 

# the below div gets added automatically 
<div class="selector" id="uniform-id_ingredient_set-0-unit" style="width: 90px;"> 

# the below span gets added automatically 
<span style="width: 76px; -webkit-user-select: none;">Unit</span> 

<select id="id_ingredient_set-0-unit" name="ingredient_set-0-unit"> 
    <option value="" selected="selected">Unit</option> 
    <option value="1">mL</option> 
</select> 
</div> 
</div>

HTML動態添加字段

<select id="unit-dyn"> 
    <option value="" selected="selected">Unit</option> 
    <option value="1">mL</option> 
</select>

增加了一條新的領域我把默認的領域克隆它，然後附加價值的新創建領域。

有沒有辦法在動態創建的字段中自動添加div和span，就像它被添加到默認字段中一樣？感謝您閱讀長問題。

來源

2015-08-19 Uma

你是否在使用JS插件進行樣式選擇輸入？ – GwynBleidD

@GwynBleidD沒有簡單的JS。雖然效果我使用jQuery UI。 – Uma

您絕對使用jQuery UI selectmenu作爲樣式設置下拉菜單，它負責在選擇上添加額外的div和span。在向表單添加新行時，selectmenu不會初始化它們。添加新行後，您應該重新初始化selectmenu。

來源

2015-08-20 23:29:17 GwynBleidD

jQuery - 動態添加CSS到HTML（令人費解）

回答

相關問題