zoukankan      html  css  js  c++  java
  • JavaScript动态的为元素添加事件

    目前的的页面布局都是基于XHTML,通过DIV+CSS布局,实现DHTML的样式。所以这个JavaScript动态的为元素添加事件因此而普遍了。下面我说说怎样通过javascript为元素动态的添加事件.
    Javascript为元素动态的添加事件包括两种情况:
    不带参数的事件和带参数的事件
    一、不带参数的事件:
    两种方式:直接给对象添加事件,节点添加事件
    例如给一个id为tab1的添加onclick事件
    第一种情况:
    var t = document.getElementById("NewTitle");
    t.onclick = function showmsg(){
        alert('Hello!World');
    }
    第二种情况 这种情况更加动态,更为实用,而且还能添加多个函数(添加的事件的顺序即执行顺序),呵呵
       var tb = document.getElementById("NewTitle");
        if(window.addEventListener){ // Mozilla, Netscape, Firefox
            td_value.addEventListener('click', alert('cc'), false);
            td_value.addEventListener('click', alert('cc'), false);
        } else { // IE
            td_value.attachEvent('onclick', function(){alert('changchang');});
            td_value.attachEvent('onclick', function(){alert('changchang');});
        }
    二、带参数的事件
    这里的functionName就是事件处理函数,如果是带参数的那该怎么办,
    有人说是这样:
    element.onclick=function(sb){
             alert(sb);
         }
    是不是上面的那种写法呢?答案是不正确的。
    解决方法:匿名函数:
        element.onclick=function() {
            functionName(param);
        };
    这样就巧妙的通过匿名方法实现了!

    直接在页面上写入

    document.getElementById('secondcanton').innerHTML = document
       .getElementById('secondcanton').innerHTML
       +"<li onClick='changsecond("+xValue+")' color='red'>"+xText+"</li>"

  • 相关阅读:
    SQL经常使用语法
    【LeetCode】Generate Parentheses 解题报告
    Linux进程间通信(IPC)
    Android菜单menu控件大全
    Android入门常见问题
    c++ struct与class的差别
    hdu 2011 多项式求和
    Android安全机制介绍
    HDOJ 4003 Find Metal Mineral
    HDU 2845 Beans (两次线性dp)
  • 原文地址:https://www.cnblogs.com/zhangqs008/p/2341191.html
Copyright © 2011-2022 走看看