在动态创建和填充后,如何设置文本框或下拉列表框的样式?

时间:2015-07-16 08:33:24

标签: javascript html css

动态创建文本框或下拉列表框后,会动态填充这些文本框或下拉列表框。任何人都可以帮助用css设置这些动态创建的下拉列表或文本框等。

这是我想要设置样式的代码

标签包含"选择尺寸"和"选择颜色"

$secondScreen .= <<<MARKUP

<div class="{$giftcss}">
   <input type="hidden" name= "product_id{$i}" value="{$productId}"/> 
   <div class="gift-img"><img src="http://{$domainName}/gifts/images/{$prod_img_name}" height="250"></div>
   <div class="divider"></div>
   <div class="gift-desc"><h3>{$product_name}</h3><span>{$product_desc}</span></div>
   <div style="width:100%;">
     <h3 style="display:{$headlineVisib}">Customize your gift</h3><br>
     <p  style="display:{$sizeVisibility};">Select Size<select id = "prod_size{$i}" name="prod_size{$i}" >{$sizeOptionValues}</select></p>
     <p style="display:{$colorVisibility};">Select Color<select id = "prod_color{$i}" name="prod_color{$i}" >{$colorOptionValues}</select></p>
     <p style="display:{$personalisedVisib};">{$personalisedMsg}</p>
   </div>
MARKUP;

1 个答案:

答案 0 :(得分:1)

解决方案是使用JavaScript样式属性 例如:

var element = document.getElementById("element");
element.style.color = "#F90";
element.style.backgroundColor = "#F0F0F0";

或者你可以像往常一样写你的CSS

element.cssText = "color:#F90; background-color:#F0F0F0";