Js事件和函数

JavaScript函数和事件

系统自带函数

isNaN()检查数值算法为数字，返回true|false,字符返回true,数字返回flase,根据值来判断是否为数字，不会根据数据类型来判断
eval();将字符串中的代码运行

    <script>
        var a = 5;
        //true
        document.write(isNaN("aaa123"));
        //flase
        document.write(isNaN(a));
        //flase,这isNaN指挥值判断是否为数字，不根据数据类型来判断
        document.write(isNaN("123"));
    </script>

    <script>
    var a = "alert(123)";
    //弹出警告框123  
    eval(a);
    </script>

自定义函数

fun 函数名 （参数1，参数2,….）
{

函数代码块

}
或、
var 函数名 = function(参数1，参数2，……)
{

函数代码块

}

<script>
            function fun1(x){
                document.write(x+"<br />");
            }
            fun1(1);
            fun1(2);
            fun1(3);*/

            function squre1(number){
                return number * number;
            }

            document.write( 5+"平方为："+squre1(5)+"<br />");

            var squre2 = function(num){
                return num * num ;
            }
            document.write(5 +"的平方："+squre2(5))
        </script>

匿名函数

<script>
   (function(x,y){
        alert(x+y);
        return x+y;
        //匿名函数的使用

        }(3,4));
</script>

全局变量和局部变量

全局的变量：在最外部定义的变量，不使用var定义的变量（自动放在了window对象下）
局部变量：定义在函数内，起作用域为函数

<script>
    function fun1(){
        //这样写是window.a,window是隐藏的
        a = 10;
        //局部变量
        var b = 15      
                }
        fun1();
        //调用的是window.a  
        alert(a);
</script>

事件

1. onload 页面全部加载完时触发，也可以写在标签里面

    <script >
            //当页面全部加载完成时触发
    /*      window.onload = function(){
                alert(888);
            }*/
            function fn(){
                alert(888);
            }
        </script>

1. onfocus 获得焦点时触发,多用于表单

//onfocus：是属性
<input type="text" onfocus="fun1()" /> 
        <script>
            function fun1(){
                document.write("input获取焦点时触发函数<br/>")
            }
        </script>

1. onblur 失去焦点时触发，onchange 文本改变时触发

<input type="text" id="in"/> 
        <script>
            document.getElementById("in").onfocus=fun1;
            function fun1(){
                //log日志
                console.log("input获取焦点时触发函数<br/>");
            }
            //失去焦点，调用匿名内部函数
            document.getElementById("in").onblur =function(){
                    console.log("input失去焦点时触发函数");
            }
            document.getElementById("in").onchange = function(){
                console.log("我被改变了");
            }
        </script>
````
4. onsubmit表单提交时触发





<div class="se-preview-section-delimiter"></div>

```html
    //action="#" 提交到当前页面
    <form action="#" id="from1">
            <input type="text" />
            <input type="submit" />
        </form>
        <script>
            document.getElementById("from1").onsubmit = function(){
                console.log("表单提交了！");
                alert(999)
            }
        </script>

1. onmouseover鼠标移动到上面触发，onmouseleave鼠标离开触发

    //action="#" 提交到当前页面
    <form action="#" id="from1">
            <input type="text" />
            <input type="submit" />
        </form>
        <script>
            document.getElementById("from1").onsubmit = function(){
                console.log("表单提交了！");
                alert(999)
            }
        </script>

1. onmouseover鼠标移动到上面触发，onmouseleave鼠标离开触发

<h1 id="d1">我是污妖王</h1>
        <h2 id="d2" onmouseover="console.log('哈哈哈哈！')">我是小明</h2>

        <script>
            var wyw = document.getElementById("d1");
                wyw.onmouseover = function(){
                    console.log("哇！你好污！！！");
                }
                wyw.onmouseleave = function(){
                    console.log("还好啊！！！")
                }
        </script>

1. onclick对象被单击时，ondbclick对象被双击时

    <script>
            var wyw = document.getElementById("d1");

                wyw.onclick = function(){
                    console.log("单击污妖王");
                }
                wyw.ondblclick = function(){
                    alert("不要双击污妖王！");
                }
    </script>

submit的确定提交可取消提交

<form action="#" id="from1">
            留言板标题<input /><br />
            留言内容<textarea></textarea>
            <input type="submit" value="提交"/>
        </form>
        <script>
            var kk = document.getElementById("from1");
                kk.onsubmit = function(){
                    var isSumit = confirm("确定提交");
                    if(isSumit){
                        return true;
                    }
                    return false;
                }
        </script>

输出调试法

1. alter()调试法
2. document.write()调试方法
3. console对象调试法(IE不支持)，console.log(“str”)打印log日志，在开发窗口查看

调试工具

Firebug、游览器自带开发窗口，使用f12调出开发窗口