jquery批量绑定click事件

jquery批量绑定click事件:

var selects = $(".public_select dd ul li");
    debugger;
    /*$(".public_select dd ul li a").each(function(){
        /!*$(this).click(function(){
            alert("aa");
        })*!/
        alert("cc");
        $(this).bind("click", function(){
            alert("Hello World bind");
        });

    })*/
    selects.bind("click", function(){
        var a = $(this);
        var b = $(this).children("a")[0];
        var op = $(this).children("a")[0].attributes[0].value;
        debugger;
        $(".public_select dd ul li a").removeAttr("style");
        $(".public_select dd ul li a[op="+op+"]").css("background","#a7c2fe");
    });

因为a标签绑定不上click(原因未知),改为li绑定事件,li标签与a标签一一对应。

<dl class="public_select" id="status">
                <dt op="0">未提交</dt>
                <dd>
                    <ul>
                        <li><a op="">--请选择--</a></li>
                        <li><a op="0">未提交</a></li>
                        <li><a op="1">已提交</a></li>
                    </ul>
                </dd>
            </dl>

注释掉的参考代码:

//var selects = $(".public_select dd ul li a");
    /*$(".public_select dd ul li a").each(function () {
        $(this).click(function () {
            alert("aa");
            /!*this.
                var op = this.attr("op");
            $(".public_select dd ul li a").css("background","none");
            $(".public_select dd ul li a[op="+op+"]").css("background","#a7c2fe");*!/
        })
        /!*var op = this.attr("op");
        $(".public_select dd ul li a").css("background","none");
        $(".public_select dd ul li a[op="+op+"]").css("background","#a7c2fe");*!/
    })*/

原文地址:https://www.cnblogs.com/super-chao/p/8127156.html

时间: 2024-10-29 18:27:58

jquery批量绑定click事件的相关文章

JQuery调用绑定click事件的3种写法

第一种方式: $(document).ready(function(){ $("#clickme").click(function(){ alert("Hello World click"); }); 第二种方式: $('#clickmebind').bind("click", function(){ alert("Hello World bind"); }); 第三种方式: $('#clickmeon').on('click

针对jquery绑定click事件执行两次,layer弹出框,以及img的map属性应用。

前不久使用jQuery与layer实现一个弹出框,发现在绑定弹出框事件时,事件执行了两次,准确的说是方法同时注册了两次,不分先后执行了两遍,导致弹出框弹出两次.请教同事后,发现原因有可能是jQuery的js与layer的js冲突(具体原因还需要深入了解),通过网络和请教同事,得到了三种处理方法. 方法一:不采用jQuery进行事件的绑定,直接在标签中添加onclick事件. 方法二:采用这种方式$("#item_add_button")[0].onclick = function(){

jquery单选框radio绑定click事件实现和是否选中的方法

使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1.<input type="radio" name="testradio" value="jquery获取radio的值" />jquery获取radio的值2.<input type="radio" name=&

JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbind('click').click(function(){ //此处填写逻辑代码 }) ------ 因为利用js在页面加载后添加需要点击事件的代码,发现在点击后会代码会执行两次,因为有toggle效果,导致弹窗出现又很快丢失 查了一些资料,发现这是冒泡的原因,需要在点击事件代码中加入阻止冒泡的方法: e.s

jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件

jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQuery是目前使用最广泛的javascript函数库.据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司甚至把jQuery作为他们的官方库. jQuery的版本分为1.x系列和2.x.3.x系列,1.x系列兼容低版本的浏览器,2.x.3.x系列放弃支持低版本浏览器

ASP.NET绑定CHECKBOXLIST--------JQUERY绑定CLICK事件,获取CHECKBOX的VALUE和显示值

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server&qu

[ 面试没回答上的问题2]IOS上给body绑定click事件的bug

面试被问到ios上的bug,自己提到绑定click事件的bug,但是并没有把问题讲的很清楚,这里再清理一下思路. 这个bug只在IOS上有,包括ihone,ipad,由于ios浏览器都用的safari内核,所以ios浏览器全部中枪. bug描述 在进行事件委托时,如果将未存在于DOM的元素事件直接委托到body上的话,会导致事件委托失效,调试结果为事件响应到body子元素为止,既没有冒泡到body上,也没有被body所捕获.但如果事件是DOM元素本身具有的,则不会触发bug.换而言之,只有元素的

给js创建的一个input数组绑定click事件

</pre><pre name="code" class="javascript"><html> <body> <input type="button" name="input[]" value="按钮1" /><br /> <input type="button" name="input[]&quo

动态生成DOM元素绑定click事件无效问题

在页面里,jq动态生成dom节点,该节点的click事件无效. 如,html里动态添加class名为.del的<a>, js文件中: $('.del').bind('click',fuction(){ alert('sda'); }) 不响应, 网上说可以用live代替bind事件,但在jq1.7版本开始,就取消了live事件, 解决方法: on()事件 代码改为: $(document).on('click','.del',fuction(){ alert('sda'); }) 这样就搞定了