动态添加的html不会被设置样式

时间:2015-11-08 01:08:09

标签: javascript jquery html css

我希望将商品列表显示为样式单选按钮,我希望它们列在一个表格中,每行有3个商品。 我在这样的css文件中设置它们的样式:

EADDRNOTAVAIL

我的asp页面是这样的:

input[type=radio].offer + label {
display:inline-block;
margin:-2px;
padding: 15px 12px;
margin-bottom: 0;

line-height: 20px;
width: 175px;
color: #333;
text-align: center;
text-shadow: 0 1px 1px rgba(255,255,255,0.75);
vertical-align: middle;
cursor: pointer;
background-color: #f0f0f0;

border: 1px solid #ccc;
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
border-bottom-color: #b3b3b3;
}

input[type=radio].offer:hover + label {
background-color: #f8ad51;
}

一切正常,我的列表看起来还不错,但现在我希望在$(文档)中创建列表.ready 所以我现在有了这张表:

sql1 = "SELECT * FROM company,prices WHERE companyId = company_id"
Set rs1 = Connect.Execute(sql1)
if NOT rs1.eof then
   count = 1%>
   <table border="0" cellpadding="2" cellspacing="10" width="600">
     <tr>
       <%
       do until rs1.eof
          price = a lot of calculations.......%>
          <td><input type="radio" id="offer<%=count%>" name="offer" value="<%=rs1("companyId")%>" class="offer" onClick="this.form.submit1.disabled = !this.checked;">
          <label for="offer<%=count%>"><%=rs1("navn")%><br><font size="1"><%=rs1("city")%></font><br><font size="4"><%=price%></font></label>
        </td>
        <%
        if count MOD 3 = 0 then%>
           </tr><tr>
        <%end if
        count = count + 1
        rs1.MoveNext
     loop%>
     </tr>
   </table> 
<%end if%>

我做了很多javascript的东西,并为我找到的每个优惠结束了这个:

<table id="tbl_result" border="0" cellpadding="0" cellspacing="0" width="380"></table>

最后我将它添加到页面中:

final_list+='<td>';
final_list+='<input type="radio" id="offer'+data.id+'" name="offer" value="'+data.id+' class="offer" onClick="this.form.submit1.disabled = !this.checked;">';
final_list+='<label for="offer'+data.id+'">'+data.cmp+'<br><font size="1">'+besked+'</font><br><font size="4">'+data.price+' kr.'+'</font></label>';
final_list+='</td>';
if ((finalList_count % 3) == 0) {
   final_list+='</tr><tr>';
}
finalList_count = finalList_count + 1

我的问题是我的新优惠不能通过我的css文件设置样式,我不知道如何做到这一点。有谁可以帮助我吗?

1 个答案:

答案 0 :(得分:1)

在创建final_list时,在创建class属性之前,您缺少双引号"。因此,您需要使用value="'+data.id+' class="offer"而不是value="'+data.id+'" class="offer"(在课前注意")。

所以final_list的第一行变为:

final_list += '<input type="radio" id="offer' + data.id + '" name="offer" value="' + data.id + '" class="offer" onClick="this.form.submit1.disabled = !this.checked;">';

有关工作示例,请参阅此jsFiddle