js-事件-作用域问题

先来看一个示例：

-----------------------------------------------------------

html代码：

 

      <div class="mt50">

            <button onclick="var s = 111; f()">这个按钮1</button>

            <button onclick="var s = 222; (function() {alert(s)})();">这个按钮22222</button>

        </div>

-----------------------------------------------------------

js代码：

 

 

<script type="text/javascript">

    var s = 123;

    function f() {

        alert(s);

    }

</script>

 

-------------------------------------------

结果： 

点击按钮1： 输出123 

点击按钮2： 输出222

---------------------------------------------

 

第一眼看这个结果，很是诧异，不过这样改一改，自然就很清晰了：

 

-----------------------------------------------------------

html代码：

<input type="button" value="测试event按钮" id="Event-input"/>

------------------------------------------------------------

js代码：

 

var a = 1111;

 

    function func() {

        alert(a);

    }

 

    var btn = bu.$("Event-input");

    btn.onclick = function() {

        var a = 222222;   // 由于这个函数是一个单独的作用域，跟外部定义的变量a不在同一个域中，自然两个a没有影响。

        func();

    }

 

 

-------------------------------

输出结果：1111