`
a729812804
  • 浏览: 41844 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js为li元素添加监听 jsp其他元素同理

    博客分类:
  • js
阅读更多

 

//监听事件

function handler(event) {
                  var index =event.data.index;
                  var lis = $("#navul li ");
                   $.each( lis, function(i, n){
                    if(i==index){
                          $(this).addClass("ej_nav font-in");
                    }else
                    {
                          $(this ).removeClass();
                    }
                 });
             }
            //通过li的ID设置监听
            $(function(){
              var lis = $("#navul li a");
              $.each( lis, function(i, n){
                $(this).bind("click", {index: i}, handler)
                });
            });

 

 

jsp 内容

 

 

<ul id="navul">
                        <li class="ej_nav font-in">
                            <a href="#"
                                onClick="gotourl('url);"
                                class="jc_nav_ico1" id="nav_gn">污染物限量</a>
                        </li>
                        <li >
                            <a href="#"
                                onClick="gotourl('url');"
                                class="jc_nav_ico1" id="bz_gj">真菌毒素限量</a>
                        </li>
                        <li >
                            <a href="#"
                                onClick="gotourl('url');"
                                class="jc_nav_ico1" id="nav_cyzb">农药残留限量</a>
                        </li>

  • 大小: 5.9 KB
分享到:
评论

相关推荐

    javaScript动态添加Li元素的实例

    JavaScript动态添加Li元素是前端开发中常见的一项技术,可以将新的列表项(li元素)动态添加到现有的HTML文档中。在给定的文件内容中,包含了两种主要的技术实现:使用innerHTML和使用createElement。下面将对这两种...

    js监听滚动条改变导航元素位置和样式.rar

    这个名为"js监听滚动条改变导航元素位置和样式.rar"的压缩包文件提供了一个实例,教你如何利用原生JavaScript来实现这一功能,特别适合初学者学习。以下是关于这个主题的详细讲解。 首先,我们需要理解滚动条事件。...

    利用js实现向OL列表内动态添加LI元素的方法.html

    利用jjs实现向OL列表内动态添加LI元素的方法示例,分享资源

    li标签前面添加图标

    在HTML中,我们经常需要为`&lt;li&gt;`(列表项)元素添加图标,以增强页面的视觉效果和信息传达。本文将详细介绍三种方法来实现这一功能:使用`list-style-image`属性、通过背景图片(`background`)以及利用字体库引入...

    JavaScript给每一个li节点绑定点击事件的实现方法

    JavaScript提供了多种方法来选取页面中的元素,其中`getElementsByTagName`是一种常用的获取指定标签名元素的方法。在给定的示例中,通过`document.getElementsByTagName("li")`获取了所有li节点并将它们存入一个...

    js键盘箭头控制上下选中标签元素

    在JavaScript编程中,使用键盘箭头来控制选中标签元素是一项常见的交互设计,尤其是在网页应用中。这个小demo展示了如何通过监听键盘事件并处理箭头键的按下,以实现元素的选择切换。以下将详细讲解这一功能的实现...

    jsp ul 下的li 标签循环滚动

    在`jsp`页面中,我们经常会遇到需要实现元素动态效果的需求,例如`ul`(无序列表)下的`li`(列表项)标签进行循环滚动。这种效果可以增强用户界面的交互性和吸引力,常见于新闻滚动、公告栏或者菜单导航等场景。 ...

    js循环给li绑定事件实现 点击li弹出其索引值 和内容的方法

    jQuery 的 `.click()` 方法允许我们轻松地为元素添加点击事件处理函数,并且通过 `$(this)` 可以方便地获取当前元素的信息。 ```javascript // 使用 jQuery $("ul li").click(function() { var item = $(this)....

    JavaScript实现向OL列表内动态添加LI元素的方法

    JavaScript实现向OL列表内动态添加LI元素的方法涉及几个重要的Web开发概念和技术点,具体如下: 1. DOM操作:文档对象模型(DOM)是一个跨平台的接口,允许程序和脚本动态地访问和更新文档的内容、结构和样式。在本...

    jquery添加和删除元素

    在这个例子中,当用户点击ID为"addButton"的按钮时,会创建一个新的`&lt;li&gt;`元素,并将其添加到ID为"itemList"的`&lt;ul&gt;`列表的末尾。 在`jquery`文件中,可能包含了jQuery库的引用以及一些基本的使用示例。jQuery库...

    【JavaScript源代码】JavaScript给事件委托批量添加事件监听详细流程.docx

    1. **减少DOM操作**:通过事件委托,我们可以避免为每个子元素单独绑定事件监听器,这减少了对DOM的操作次数,提升了程序效率。 2. **动态元素处理**:对于那些可能会动态添加或删除的子元素来说,事件委托可以确保...

    js 动态添加元素(div、li、img等)及设置属性的方法

    4. 动态添加img元素:在动态添加li元素的基础上,还需要创建img元素,并设置其`src`属性为图片地址,然后将img元素添加到li元素中,最后将li元素添加到ul元素中。 5. 动态添加元素的方法总结:对于不同的HTML元素,...

    弹出框li标签

    3. **JavaScript与li标签交互**:利用JavaScript,我们可以监听li元素的事件,如`click`事件,当用户点击li元素时,执行相应的JavaScript函数,比如显示或隐藏弹出框。此外,还可以通过JavaScript动态改变li元素的...

    LI更换背景更换显示区域内容JS效果

    在JavaScript编程领域中,"LI更换背景更换显示区域内容JS效果"是一个常见的需求,尤其在构建动态用户界面时。这个主题涉及到DOM操作、事件监听、CSS样式修改等多个方面。下面我们将详细探讨这些知识点。 首先,`LI`...

    js+jsp标签实现页面级联菜单

    - DOM操作:通过JavaScript获取DOM元素,添加事件监听器,对菜单项进行增删改查。 - 事件处理:处理用户的点击事件,控制子菜单的显示和隐藏。 - 动画效果:可以使用CSS3的transition或JavaScript库如jQuery来...

    小例子,jsp实现的拖拽功能

    这个“小例子,jsp实现的拖拽功能”旨在演示如何在JavaServer Pages(JSP)中集成拖放功能,让用户能够通过鼠标直接拖动元素在页面上进行操作,如移动、排序或者进行其他数据处理。本文将深入探讨这个主题,解释相关...

    JS实现为动态添加的元素增加事件功能示例【基于事件委托】

    在JavaScript中,我们没有为每个`&lt;li&gt;`元素单独绑定点击事件,而是为`&lt;ul&gt;`元素添加了一个点击事件监听器。当用户点击`&lt;li&gt;`时,事件会冒泡到`&lt;ul&gt;`,并在那里被处理。通过检查`event.target`(即触发事件的元素),...

    JavaScript获取表单内所有元素值的方法

    本文实例讲述了JavaScript获取表单内所有元素值的方法。分享给大家供大家参考。具体如下: 下面的JS代码可以遍历指定表单中的所有元素,并输出元素的值 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;form id=...

Global site tag (gtag.js) - Google Analytics