在 iframe 中的 asp.net javascript getelementbyid答案

【问题标题】：asp.net javascript getelementbyid in iframe在 iframe 中的 asp.net javascript getelementbyid
【发布时间】：2017-07-24 19:07:56
【问题描述】：

我正在尝试在 iframe 中填充我的表单。我需要在文本框中输入一个值并从下拉菜单中选择一个值。

网络表单1

<!DOCTYPE html>    
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="admin-lte/js/app.min.js"></script>
    <script src="Scripts/jquery-2.1.3.min.js"></script>

</head>
<body>
    <style type="text/css">
    body {scrolling:no;
}
    iframe {position:absolute;
    z-index:1;
    top:0px;
    left:0px;
}
</style>
    <form id="form1" runat="server">

    <iframe id="frame1" src="WebForm4.aspx" width="100%" height="100%" frameborder="0">
</iframe>

    <script>
        function getElementWithinIframe() {


            var iframe = document.getElementById('frame1');
            var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;

            var quantity = innerDoc.getElementById("txtQuantity");
            quantity.value = "5";

            var submit = innerDoc.getElementById("btnQuantity");
            submit.click();
        }
    </script>

    </form>
</body>
</html>

webform4

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:DropDownList ID="ddlProd" runat="server">
            <asp:ListItem>Product1</asp:ListItem>
            <asp:ListItem>Product2</asp:ListItem>
            <asp:ListItem>Product3</asp:ListItem>
            <asp:ListItem>Product4</asp:ListItem>
            <asp:ListItem>Product5</asp:ListItem>

        </asp:DropDownList>
        <asp:TextBox ID="txtQuantity" runat="server"></asp:TextBox>

        <asp:Button ID="btnSubmit" runat="server" Text="Submit" />

    </div>
    </form>
</body>
</html>

这不起作用。我错过了什么？

我已经阅读了多篇文章，但我认为我没有得到它。

Javascript - Get element from within an iFrame

How to pick element inside iframe using document.getElementById

感谢任何帮助。

-- 谢谢

【问题讨论】：

标签： javascript jquery html asp.net iframe

【解决方案1】：

在您使用btnQuantity 的父级的javascript 中，而WebForm4.aspx 中的按钮具有ID btnSubmit。所以把脚本改成：

var submit = innerDoc.getElementById("btnSubmit");

然后在某处调用该函数，无论是单击按钮还是页面加载。

<input type="button" onclick="getElementWithinIframe()" value="ClickMe">

<script>
    $(document).ready(function () {
        setTimeout(function () { getElementWithinIframe(); }, 250);
    });
</script>

【讨论】：

好吧，那是我的错误。但它仍然不起作用。正如你所说，我改变了脚本。文本框（txtQuantity）未填充。
它适用于我的测试环境。有没有把WebForm4后面的代码里txtQuantity的内容清除掉，可能因为你也在做form post。
你必须在某个地方打电话给getElementWithinIframe。