Question

如何让这段代码生效？

$("#send_button").css({ opacity: 0.2 });

此代码应用于document ready上div内的元素。该div被事件中的其他div替换，然后使用html()再次重新插入。

这是div（例子）：

<div id="dinamic_div"><img src="image.jpg" id="send_button"></div>

Answer 1

创建一个CSS规则，它将应用于与选择器匹配的任何对象，即使它是动态创建的。

#send_button {opacity: 0.2;}

或者，在类名上创建一个具有不透明度的CSS规则，并将类名放在按钮上：

.lightButton {opacity: 0.2;}

<div id="dinamic_div">
    <img src="image.jpg" class="lightButton" id="send_button">
</div>

如果你必须使用javascript，那么你最简单的方法是在动态对象创建时设置样式。

如果你不能这样做，你可以用javascript创建一个CSS规则。

工作示例：

var html = '<div id="dinamic_div"><img src="http://dummyimage.com/200x100/000/fff&text=Hello" id="send_button"></div>';

$(html).appendTo(document.body);

var style = document.createElement("style");
style.type = "text/css";
style.innerHTML = "#send_button {opacity: 0.2;}";
document.getElementsByTagName("head")[0].appendChild(style);

工作演示：http://jsfiddle.net/jfriend00/Cnbvg/

如何为css创建实时事件

1 个答案: