Question

我想知道如何在用户点击下面的img链接“importantImg”后使用jquery显示多个div（importantImg不在下面，但在我的程序中）。问题是，这只是整个页面的一个片段，也有div，所以我不想让我的选择是“div”，我只想与这4个特定的div进行交互。这是包含5个div的html：

<div id="divLayer1">
<div id="divLayer2" class="alertPod">
    <img src="<%= Page.ResolveUrl("~/{0}/_res/_images/icon_alertMessage.png",   PBS.Cms.Settings.PBSFolderName) %>" />

</div>

<div id = "divLayer3" class="msgPod">
    <div id= "divLayer4" class="messageWrapper">
        <h6>IMPORTANT ANNOUNCEMENT</h6>
        <div class="box">         
            <div id="divLayer5" class="viewport" style="overflow: auto; height: 48px;"  runat="server">
                <p> <%--id= "importantMessage">--%> 
                <asp:Literal ID="ltimportantannouncementTitle" runat="server"></asp:Literal>
                <br />
                <asp:Literal ID="ltimportantannouncementSummary" runat="server"></asp:Literal>
                </p>
            </div>
        </div>
    </div>
    <a href="#" ><img id="alertCloseBtn" src="<%= Page.ResolveUrl("~/           {0}/_res/_images/button_alertMsgClose.png", PBS.Cms.Settings.PBSFolderName) %>" /></a>

这是我正在使用的jquery脚本无效：

<script type="text/javascript">
    $(document).ready(function () {
        $("img#importantImg").click(function () {                
            $("#divLayer1").show(); 
            $("#divLayer2").show(); 
            $("#divLayer3").show();
            $("#divLayer4").show();
            $("#divLayer5").show();                                                
            $("#importantImg").attr("src", "<%=  Page.ResolveUrl("~/{0}/_res/_images/icon_alertMessage.png", PBS.Cms.Settings.PBSFolderName) %>");                               
        });
    });

</script>

Answer 1

这里有两件事：

1）您不需要为每个函数执行$（document）.ready（）。你可以做一次，然后把所有东西放在里面。

2）你的例子有点棘手，因为这是一个jQuery问题，那里有ASP代码。以下是我对你要做的事情的解释：

使用Javascript： $（document）.ready（function（）{ $（'＃show_message'）。click（function（）{ $（'。message'）。html（'这是一条重要的信息！'）; $（ 'alert_pod'）显示（）。 }）;

        $('#hide_message').click(function() {
           $('.alert_pod').hide();
       });
    });

HTML：显示消息重要信息转到这里隐藏消息

我不知道ASP（或者你正在使用的任何东西），但我怀疑问题是你的某些元素似乎没有ID。你在Javascript中调用它们，但是JS找不到这些元素，因为没有id =“importantImg”就像我所说的那样近。

希望有所帮助。

jquery显示多个图层div

1 个答案: