类别:前端知识

日期:2021-03-05 浏览:2261 评论:0

前端HTML

                    <ul class="menu-wrap1">
                        <li class="lis" onclick="onclickli(this,'0');" id="li0" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                全部
                                <p class="menu-text">日期</p>
                            </a>
                        </li>
                        <li class="lis" onclick="onclickli(this,'1');" id="li1" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                明天
                                <p class="menu-text" id="day1" runat="server">3月04</p>
                            </a>
                        </li>
                        <li class="lis" onclick="onclickli(this,'2');"  id="li2" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                <p id="z1" runat="server">周五</p>
                                <p class="menu-text" id="day2" runat="server">3月05</p>
                            </a>
                        </li>
                        <li class="lis" onclick="onclickli(this,'3');"  id="li3" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                <p id="z2" runat="server">周五</p>
                                <p class="menu-text" id="day3" runat="server">3月06</p>
                            </a>
                        </li>
                        <li class="lis" onclick="onclickli(this,'4');"  id="li4" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                <p id="z3" runat="server">周五</p>
                                <p class="menu-text" id="day4" runat="server">3月08</p>
                            </a>
                        </li>
                        <li class="lis" onclick="onclickli(this,'5');"  id="li5" runat="server">
                            <a href="#" runat="server" onserverclick="Unnamed_ServerClick">
                                <p id="z4" runat="server">周五</p>
                                <p class="menu-text" id="day5" runat="server">3月09</p>
                            </a>
                        </li>
                    </ul>

JS代码

   获取所有class为 lis 的元素 进行遍历

 	    function onclickli(idli,i)
	    {
	        $('.lis').each(function(i,n){
	            $(n).css("background","");
	        });
	        $(idli).css("background", "#DBDBDB")
	        $("#liid").val(i);
	    }

后端代码:

li0.Attributes.CssStyle.Add("background", "#DBDBDB");
li1.Attributes.CssStyle.Add("background", "");
li2.Attributes.CssStyle.Add("background", "");


本文标题:jquery 遍历页面所有 li 元素,前端,后端加背景样式
本文链接:https://vtzw.com/post/618.html
作者授权:除特别说明外,本文由 零一 原创编译并授权 零一的世界 刊载发布。
版权声明:本文不使用任何协议授权,您可以任何形式自由转载或使用。
 您阅读本篇文章共花了: 

 可能感兴趣的文章

评论区

发表评论 / 取消回复

必填

选填

选填

◎欢迎讨论,请在这里发表您的看法及观点。

最新留言