1. 程式人生 > >前端 js 指令碼執行不了,jquery庫跟$(id).onclick 衝突

前端 js 指令碼執行不了,jquery庫跟$(id).onclick 衝突

問題描述

此問題把我弄得欲哭無淚,浪費了我一整天的時間,前端太蛋疼,特備是js,我連報錯的地方都不知道在哪裡,才疏學淺,只能一個alert 輸出出來,看那一段程式碼輸出不出來,好吧,先說一下問題:
(1) js程式碼執行不出來
(2) jquery庫跟$(id).onclick 衝突

問題解決

關於第一個問題,出錯的方式有很多種,
1. 首先判斷你的JS路徑是不是對的
2. 判斷你的js指令碼中的函式中是不是有哪一步程式碼有問題,可能是某一步程式碼有問題,比如你利用document.getElementById(id) 這個id不存在等等之類的,
3. jquery庫跟$(id).onclick 衝突,這個問題很不好弄,因為 你都不知道怎麼就錯了,關於這個問題我就重點介紹一下

jquery庫跟$(id).onclick 衝突

這個問題首先是因為你的程式碼這樣寫,

    var $ = function(id){
        return "string" == typeof id ? document.getElementById(id) : id;
    }

定義一個$函式,然後針對某些按鈕點選操作有如下 自己定義的 程式碼:

 $('addNum').onclick = function(e){
        ...
    };

如果這個時候,你的頁面也引用了jquery庫,比如如下:

    <script type
="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.js">
</script>

很高興的告訴你,此時衝突了,因為jquery庫中也有利用$來獲取物件獲取函式,此刻會有衝突,要不就是jquery程式碼不行,要不就是你寫的js會出現問題,所以正常就將你自己定義的函式改一下,加一個英文字母,如下:

    var $id = function(id){
        return "string" == typeof id ? document.getElementById(id) : id;
    }

此刻問題解決了,

總結

js還要繼續學習。

參考部落格