从父页面更改iframe中div的背景颜色无法正常工作

2024-05-05 • 问答

我在父页面的<head>中拥有此地址：

<script type="text/javascript">
    $(document).ready(function () {
        $('#innerframe').load(function () {
            $(this).contents().find($(".TitleBG")).css("background-color","red");
        });
    });
</script>

<iframe src="/HomePage.aspx" onload="Getalerts();" id="innerframe"></iframe>

然后在iframe的.aspx页面中有一个示例div：

<div class="col-md-12">
    <div class="col-md-1 TitleBG">Drive</div>
    <div class="col-md-3 TitleBG">Name</div>
    <div class="col-md-1 TitleBG">Type</div>
    <div class="col-md-1 TitleBG">Format</div>
    <div class="col-md-2 TitleBG">Free Space</div>
    <div class="col-md-2 TitleBG">Available Space</div>
    <div class="col-md-2 TitleBG">Drive Size</div>
</div>

我想替换具有“ TitleBG”类的div的background-color属性，但是我的尝试似乎不起作用（在jquery上方）？

但是，当我对父页面中的元素执行$(".TitleBG").css("background-color","red");时，它会起作用。

代替

find($(".TitleBG"))

使用

find(".TitleBG")

似乎已弃用：

$('#innerframe').load(function () {

所以我必须使用这个：

$('#innerframe').on('load',function () {

从1.8开始，它（所讨论的原始代码）不再有效

也：

代替

找到（$（“。TitleBG”））使用

find（“。TitleBG”）

用户Wiizl指出的是另一个问题。

<script type="text/javascript">
    $(document).ready(function () {
        $('#innerframe').load(function () {
            var iFrameDOM = $("iframe#innerframe").contents();

            iFrameDOM.find(".TitleBG").css("background-color","red");
        });
    });
</script

但这不适用于第三方iframe。

尝试使用实际ID代替this，然后将查找结果更改为.find(".TitleBG")

<script type="text/javascript">
    $(document).ready(function () {
        $('#innerframe').load(function () {
            $('#innerframe').contents().find(".TitleBG").css("background-color","red");
        });
    });
</script>

您无法更改iframe页面。太简单了。

您应该考虑进行AJAX调用并创建DOM元素：https://api.jquery.com/jquery.ajax/

从父页面更改iframe中div的背景颜色无法正常工作

yanghao19840201 回答：从父页面更改iframe中div的背景颜色无法正常工作

大家都在问