Question

有人可以告诉我，如果我有一个由复选框（父级）组成的网页，并且在同一个网页上，我也有一个来自另一个页面的iframe，该页面显示了许多记录，还有一个针对每条记录的复选框（子），如果我勾选父复选框，我想将此级联到iframe中的所有子复选框以及禁用这些子复选框。

非常感谢您提供一些帮助，因为我不确定如何访问iframe中的复选框。

手册页上的iframe定义类似于以下内容：

<iframe id="iframe1" src="'+URL+'" style="border:none;width:799px;height:200px;" frameborder="1" framespacing="0" marginheight="0" marginwidth="0"></iframe>

任何示例/网站都会很棒。

感谢。贝。

Answer 1

好的，这是一个例子......

首先是iFrame内容的来源（我称之为FramePage.htm）......

<body>
    <input id="Checkbox1" type="checkbox"  name="checkbox" /> 
    <input id="Checkbox2" type="checkbox" name="checkbox"/>
    <input id="Checkbox3" type="checkbox" name="checkbox" />
</body>

以下是包含iFrame的页面上的来源......

<iframe id="frame" src="FramePage.htm"></iframe>

<input id="Button1" type="button" value="button" onclick="setData()" />

<script type="text/javascript">
    function setData()
    {
        var frame = document.getElementById('frame');

        var checkboxes = frame.contentWindow.document.getElementsByName('checkbox');

        for (var i = 0; i < checkboxes.length; i++)
        {
            checkboxes[i].checked = true;
        }
    }
</script>

单击父页面上的按钮将选择框架页面上名为“复选框”的所有复选框。

希望这有助于：）

Answer 2

这可能会有所帮助：easily access the iframe document的jquery插件。也就是说，如果它不像彼得那样跨域了。

Answer 3

不确定您的确切问题（您能否提供更多详细信息？）但如果iframe src的URL与父级不在同一个域中，则可能存在跨域安全问题，导致无法通过javascript进行操作，如根据同源政策。

Answer 4

这非常有效

$("#select_checkbox").change(function(event){
    $("#content").contents().find(':checkbox').each(function(){
        jQuery(this).attr('checked', $("#select_checkbox").is(':checked'));
    });
});

其中select_checkbox是父复选框的id，content是框架的id

如何访问iFrame复选框元素

4 个答案: