2012-04-13 53 views
1

我试图更新css(css位于我的main.css中)的div,它不存在于我的主html文件中,但是在我注入的文件中执行。这可能吗?如果是的话如何?在ajax中更新jQuery的jQuery?

确定,所以这里是我在我的主HTML文件

<div id="container"> 
<div id="page"> 
    <!placeholder> 
</div></div> 

有关的不良格式化我只是无法得到选项卡和新线与本网站上的代码输入系统工作抱歉。

下一个就是我对main.css的

#container { 
position: fixed; 
margin-right: 0px; 
overflow-x: hidden; 
overflow-y: scroll;} 
#page { 
position: absolute; 
width: 100%; 
height: 1600px; 
z-index: 10; 
border-left: 1px solid #CCCCCC;} 
#recposts { 
position: absolute; 
left:0; 
top:1200px;} 
.child { 
height: 400px; 
border-top: 1px solid #CCCCCC; 
border-bottom: 1px solid #CCCCCC; 
z-index: 11; 
background-color: #EDEDED; 
width: 100%; 
padding-right: 10px;} 

好吧,现在我正在注射

<div id ="page">  
<div id="recposts" class="child"> 
    <h1> Recent Posts </h1> 
</div></div> 

所以我需要能够编辑#recposts的位置顶部.child的高度。

我解决了我的问题,问题是我没有编辑HTML负载上的CSS。我把函数放入.load(),现在它可以工作。

+4

现在的问题是不明确 – zerkms 2012-04-13 03:00:24

+0

你是如何注入这些新文件? – 2012-04-13 03:01:10

+0

您应该编辑您的问题并发布您正在注入的代码以及您希望应用的风格。 – mrtsherman 2012-04-13 03:43:45

回答

1

你的问题不清楚,从我的理解,你可以使用jQuery生活解决它() API。 http://api.jquery.com/live/

您可以使用jquery live()api将您想要的任何内容更改为新添加的项目。

通过使用jquery的DOM change()api,可以在插入后触发一个函数调用。 http://api.jquery.com/change/

如:

$('#container').change(function() { 
    $('#page').css("height",200); 
}); 

编辑:由于变化()API不会在div的工作,这里的正确版本

$('#container').bind("DOMSubtreeModified", function() { 
    $('#page').css("height",200); 
}); 
+0

'。change'事件仅适用于某些表单元素,因此部分答案不起作用。 – 2012-04-26 19:06:38

+0

嗨乔希,你是对的,我一定没有注意到它。 – KBN 2012-04-27 05:38:46

1

如果CSS规则位于已经加载的文件(您的main.css)中,那么之后添加的任何新元素(比如说,您在讨论注入的任何HTML),并且匹配CSS中的选择器文件,将自动应用样式规则。那是你的追求?

+0

是的,这是我的想法,但我希望在注入html之前用jquery编辑css – Wilfred 2012-04-14 02:22:06

0

我不确定这是不是您正在寻找的内容,但是这会为div id =“插入”类添加类“someClass”的跨度。

CSS:

.someClass{ background-color:black; } 

HTML:

<div id="insertion"></div> 

JS:

<script> 
var toInsert = document.createElement("span"); 
toInsert.className = "someClass"; 
document.getElementById("insertion").append(toInsert); 
</script>