javascript当中绑定事件和方法

绑定事件和方法
马克- to-win:马克 java社区:防盗版实名手机尾号: 73203。
马克-to-win:once, long time to know that "script" must be put in behind, while "input" must be put in front,
  otherwise document.getElementById("button1"); can not find the "button1",alert("button1 is "+ button1); 结果就是null,为什么这次跟往常我们的印象不一样了呢?因为往常我们先写一段script,之后在body中写上诸如<INPUT TYPE="button" onclick="abc",之类的话,这样上面的abc这样的代码开始不会被执行,里面的诸如document.getElementById ("button1");也就正确了。这里为什么跟往常不一样呢?因为要在一开始时,先给button绑上事件代码,否则button无事件响应。



例 8.1(commonEventPrerequisiteIEFF.html)



<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<INPUT TYPE="button" NAME="button1" ID="button1" VALUE="单击我"/>
<script>
    function testie()
    {
        alert("单击按钮ie");
    }
    function testFF()
    {
        alert("单击按钮FireFox");
    }
 
        /**/
        /*obj.addEventListener("click",function(){func("看到我了吧");},false);
  the third argument is: A Boolean flag value that indicates whether the event listener should
use bubbling (由里向外) or capture (由外向里) event propagation. 只要我们
知道第三个参数和事件冒泡有关就可以了。缺省值为假,即冒泡的意思。具体例子参考后面的事件冒泡例子。
     */
        var button1 = window.document.getElementById("button1");
        alert("button1 is "+ button1);
        alert("document.all is" + document.all);
        alert(typeof(window.addEventListener) + " is typeof window.addEventListener");
        alert(typeof(window.attachEvent) + " is typeof window.attachEvent");
        alert(window.addEventListener + " is window.addEventListener");
        alert(window.attachEvent + " is window.attachEvent");
        if (typeof window.attachEvent === "object")
        {
            alert("ie");
            button1.attachEvent("onclick", testie);
        }
        if (typeof window.addEventListener === "function")
        {
            alert("firefox");
            button1.addEventListener("click", testFF, false);
        }
       // button1.addEventListener("click",test,false);
        //button1.attachEvent("onclick" , test);
        var str = "";

</script>






例 8.2(commonEventPrerequisite1IEFF.html)


<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<INPUT TYPE="button" NAME="button1" ID="button1" VALUE="单击我"/>
<script>
    function testie()
    {
        alert("单击按钮ie");
    }
    function testFF()
    {
        alert("单击按钮FireFox");
    }
     /*obj.addEventListener("click",function(){func("看到我了吧");},false);
  the third argument is: A Boolean flag value that indicates whether the event listener should
use bubbling (bottom up) or capture (top down) event propagation. Both types
can be registered separately but must also be removed separately. 只要我们
知道第三个参数和事件冒泡有关就可以了。
     */
        var button1 = window.document.getElementById("button1");
        if (typeof window.attachEvent === "object")
        {
            alert("ie");
            button1.onclick = testie;
        }
        if (typeof window.addEventListener === "function")
        {
            alert("firefox");
            button1.onclick = testFF;//这种方法无法设置冒泡或capture。
        }
       // button1.addEventListener("click",test,false);
        //button1.attachEvent("onclick" , test);
        var str = "";

</script>