Sebagai pengaturcara Java dalam tempoh enam bulan yang lalu, saya telah menulis lebih banyak kod JavaScript daripada kod Java Beberapa ketika dahulu, saya sedang membina sistem kawalan juruwang untuk sebuah bank, kerana keperluan kebenaran juruwang Mengambil kira pelbagai faktor, seperti kebenaran organisasi, kebenaran jenis juruwang, kebenaran kedudukan, kebenaran perniagaan, dsb., dan kebenaran ini perlu bersilang atau digabungkan beberapa kali, dan banyak JavaScript perlu digunakan pada halaman untuk kawalan. Ini telah mengakibatkan situasi di mana kod javaScript lebih bertanggungjawab untuk pelaksanaan modul berfungsi ini daripada kod java.
Sekarang kita perlu membangunkan sistem pengurusan peti simpanan untuk bank Fungsi terasnya ialah pengurusan peti deposit selamat dan pengurusan peti simpanan untuk mencapai fungsi pengurusan yang intuitif dan mudah seperti C/S seni bina, ia juga akan memproses hasil paparan masa nyata kepada pengendali Selepas beberapa hari berfikir dan bereksperimen, akhirnya kami menggunakan javaScript CSS untuk pembangunan, java untuk mengendalikan logik perniagaan, CSS untuk menyatakan pelbagai keadaan objek sasaran, dan javaScript untuk berdasarkan keadaan objek sasaran Transform untuk mencapai penukaran CSSnya.
Saya menghadapi masalah di sini, iaitu, semasa mendaftarkan fungsi pengendali acara klik untuk elemen html dalam JavaScript, contohnya, menghantar 3 parameter kepada fungsi pengendali. Walau bagaimanapun, tidak kira sama ada anda menggunakan kaedah berikut (nod mewakili nod untuk mendaftarkan acara, menyeronokkan ialah fungsi pemprosesan acara), anda tidak boleh menghantar parameter kepada fungsi pemprosesan acara:
node.addEventListener('click', fun, false); node.attachevent('onclick', fun); Node['onclick']=fun
Jelas sekali tiada kaedah yang berfungsi Sila ambil perhatian bahawa penulisannya tidak betul:
node.addEventListener('click', fun(arg1,arg2,arg3), false); node.attachevent('onclick', fun(arg1,arg2,arg3)); Node['onclick']=fun(arg1,arg2,arg3)
Nasib baik, saya membaca buku "JavaScript.DOM Advanced Programming" dan menemui penyelesaian dalam buku ini. Mula-mula tulis kaedah:
function bindFunction(obj, func){ var args = []; for(var i =2; i < arguments.length; i++) { args.push(arguments[i]); } return function(){ func.apply(obj, args); }; };
Kemudian tambahkan dua kaedah berikut dalam pustaka js anda sendiri Jika anda tidak memahami apa-apa, anda boleh merujuk kepada "Pengaturcaraan Lanjutan JavaScript.DOM Terdapat penjelasan kaedah ini dalam bahagian 2.3 buku itu, tetapi Saya telah menambah beberapa Perubahan:
function bindFunction(obj, func){ var args = []; for(var i =2; i < arguments.length; i++) { args.push(arguments[i]); } return function(){ func.apply(obj, args); }; }; window['OYF_MARK']['bindFunction'] = bindFunction; function addEvent(node, type, listener){ //使用前面的方法检查兼容性以保证平稳退化 if (!isCompatible()) { return false } if (!(node = $(node))) return false; if (node.addEventListener) { //W3C的方法(冒泡事件,如果将false改为true,则为捕获事件) node.addEventListener(type, listener, false); return true; } else if (node.attachEvent) { //MSIE的方法 node['e' + type + listener] = listener; node[type + listener] = function(){ node['e' + type + listener](window.event); } node.attachEvent('on' + type, node[type + listener]); return true; } //若两种方法都不具备则返回false return false; }; window['OYF_MARK']['addEvent'] = addEvent;
Dua fungsi di atas telah saya ubah suai sedikit berdasarkan kod sumber dalam "JavaScript.DOM Advanced Programming" dan ditambahkan pada salah satu perpustakaan js saya sendiri untuk digunakan semula. Seterusnya, anda boleh menggunakan kaedah berikut untuk mendaftarkan acara bagi elemen dan menghantar parameter kepada fungsi pemprosesan acara:
//注册新的onclick事件处理函数 OYF_MARK.addEvent(e,'click',OYF_MARK.bindFunction(e,getContainerDetail,x,y,containid));