Ajax加载后CSS出现问题 [英] Problem with CSS after ajax load
本文介绍了Ajax加载后CSS出现问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
通过ajax加载div块后，样式无效.
Hi, after load div block via ajax, style don''t work.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Example</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="posts">
<div class="post">
Some text here
<span style="float:left"><a href="#">коментувати</a></span>
<span id="settings"><a href="#">редагувати</a> | <a href="#">видалити</a></span>
<br /><br />
<hr>
</div>
<div class="post" style="">
Some text here
<span style="float:left"><a href="#">коментувати</a></span>
<span id="settings"><a href="#">редагувати</a> | <a href="#">видалити</a></span>
<br /><br />
<hr>
</div>
</div>
<div id="loadMore">Load more</div>
<style type="text/css">
#settings {
float:right;
display: none;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$('#loadMore').click(function() {
$('#posts').append('<div class="post" style="">Some text here<span style="float:left"><a href="#">коментувати</a></span> <span id="settings"><a href="#">редагувати</a> | <a href="#">видалити</a></span><br /><br /><hr></div>');
});
$(function () {
$('.post').mouseover(function () {//mouseover method for post class div
$(this).find('span').css('display', 'inline');
//select span of post class div
}).mouseout(function () {
$('.post #settings').css('display', 'none');
//select span of post class div
});
});
</script>
</body>
</html>
推荐答案
(' #loadMore' span>).click(函数(){
('#loadMore').click(function() {
(' #posts').append(' < div class ="post" style =">此处为某些文本< span style ="float:left">< a href =#">коментувати</a></span>< span id = 设置">< a href =#">редагувати</a> |< a href =#">видалити</a></span>< br/>< br />< hr></div>')； });
('#posts').append('<div class="post" style="">Some text here<span style="float:left"><a href="#">коментувати</a></span> <span id="settings"><a href="#">редагувати</a> | <a href="#">видалити</a></span><br /><br /><hr></div>'); });
(函数(){
这篇关于Ajax加载后CSS出现问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
