我使用AJAX从数据库中获取特定页面的页面内容。这是完美的，但现在我的问题:
对于'Contact'-Page，我从数据库中获得一个表单(只是HTML…)。但它忽略了我在页面头部加载的CSS。表单部件有id和类。
我的想法是，这是由于在加载CSS后插入内容引起的。
注意:我没有使用JQuery，我不想在这个项目中使用它。
格式如下:
<form method="post" action="#">
<label id="CLabel" for="sendname">Name:<span class="required"></span></label><input type="text" class="contact" name="sendname" maxlength="30" required placeholder="Your Name..(Required)"><br>
<label id="CLabel" for="sendemail">Email:<span class="required"></span></label><input type="email" class="contact" name="sendemail" maxlength="100" placeholder="Your Email-address.."><br>
<label id="CLabel" for="reason">Contact reason:</label><input type="text" class="contact" name="sendreason" maxlength="30" required placeholder="Your Reason..(Required)"><br>
<label id="CLabel" for="sendmsg"></label><textarea id="cmsg" class="noResize" name="sendmsg" required placeholder="Your Message..(Required)" onfocus="this.value='"'"; this.onfocus=null;"></textarea><br>
<label id="CLabel" for="contactbutton"></label><input class="contactbutton" type="submit" name="contactbutton" value="Send">
</form>
要查看CSS或Javascript，请查看链接:philliprohde.bugs3.com/new_/
css如下(id改为class):
label.CLabel{
display:inline-block;
width: 7em;
}
input.contact{
width:400px;
margin-top:5px;
}
/* Button of the contact form */
.contactbutton{
width: 100px;
background: #c1c1c1;
color: #8b0000;
text-transform: uppercase;
text-shadow: #000 1px 1px;
margin-top: 10px;
}
textarea.noResize { resize:none; }
textarea#cmsg {
width: 400px;
height: 120px;
margin-top:5px;
border:none;
font-family: Tahoma, sans-serif;
}
解决。主机没有接受我的新css文件(我不知道为什么)。我删除了旧的，重新上传，现在它可以工作了。
感谢您的支持!
两件事:
- 预览链接不工作;
- 你所张贴的标记是无效的(你重用ID '标签'为你的标签)。
这些都不应该影响你的CSS，尽管多id可能会在开发的其他地方给你带来一些问题。
在加载后添加内容到页面中，将由页面中的任何CSS样式(这是相关的)。
下面是我建议你调试的内容:
- 是否有可能CSS实际上没有被包含在您的期望中?打开Firebug或Chrome开发者工具，确保CSS通过时没有出现任何错误。
- 是否有可能你的CSS没有正确定位新内容?
- 从你的问题(目前)不明显，但它是可能的，你通过一个iFrame加载内容(在这种情况下，父页面的CSS不会影响它)。