Question

如何使用jquery或javascript访问<asp:multiview>内的html元素？

假设我有多视图的结构：

<div runat="server" class="tabContents" style="height:100%; width:100%;">
    <asp:MultiView id="MultiView1" ActiveViewIndex="0" Runat="server">
        <asp:View ID="v1" runat="server" >
            <iframe id="f1" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>        
        <asp:View ID="v2" runat="server" >
            <iframe id="f2" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v3" runat="server" >
            <iframe id="f3" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v4" runat="server" >
            <iframe id="f4" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v5" runat="server" >
            <iframe id="f5" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v6" runat="server" >
            <iframe id="f6" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>        
        <asp:View ID="v7" runat="server" >
            <iframe id="f7" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v8" runat="server" >
            <iframe id="f8" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v9" runat="server" >
            <iframe id="f9" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
        <asp:View ID="v10" runat="server" >
            <iframe id="f10" runat="server" style="border: None; height: 100%; width: 100%;"></iframe>
        </asp:View>
    </asp:MultiView>
</div>

我在后面的代码中尝试了这段代码：

 string s;
        s =
            "<script>" +
            "$('#f" + index++ + "').src(" + "'" + url + "'" + ");" + 
            "</script>";
        Page.ClientScript.RegisterStartupScript(this.GetType(), "ExeCuteScript", s);

但它不起作用。

请帮我解决这个问题。谢谢！

Answer 1

之前我从未使用multiviews，但如果您的代码可以访问f1，那么您的jquery就可以这么简单：

$('#<%= f1.ClientID %>')

Answer 2

如果查看页面的渲染标记，您将看到您尝试访问的元素的ID与您指定的元素的ID不同。这是因为ASP.NET为runat="server"元素生成唯一ID。

但是，您会注意到ID的最后一位是您在XAML中指定的实际ID。您可以通过使用jQuery“endswith”选择器来完成此操作：

String.Format("$('[id$=f{0}]').src('{1}');", index++, url);

所以你的代码块变成了：

string s;
s = "<script>" +
    String.Format("$('[id$=f{0}]').src('{1}');", index++, url) + 
    "</script>";
    Page.ClientScript.RegisterStartupScript(this.GetType(), "ExeCuteScript", s);

或者，如果您未在代码隐藏中使用iframe，只需从中删除runat="server"。

我无法访问<asp：multiview> </asp：multiview>中的html元素

2 个答案: