jQuery membatasi kotak teks untuk memasukkan hanya angka
JQuery membatasi kotak teks untuk memasukkan hanya angka, yang kompatibel dengan IE, Chrome, dan FF (efek kinerja berbeda). Kode sampel adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
$ ("input"). keyup (function () {// pemrosesan acara keyup
$ (ini) .val ($ (ini) .val (). Ganti (// d |^0/g, ''));
}). bind ("pasta", function () {// ctr+v pemrosesan acara
$ (ini) .val ($ (ini) .val (). Ganti (// d |^0/g, ''));
}). CSS ("IME-Mode", "Disabled"); // metode input pengaturan CSS tidak tersedia
Tujuan dari kode di atas adalah: hanya bilangan bulat positif yang lebih besar dari 0 yang dapat dimasukkan.
Salinan kode adalah sebagai berikut:
$ ("#rNumber"). keyup (function () {
$ (ini) .val ($ (ini) .val (). Ganti (/[^0-9.]/G, ''));
}). bind ("pasta", function () {// ctr+v pemrosesan acara
$ (ini) .val ($ (ini) .val (). Ganti (/[^0-9.]/G, ''));
}). CSS ("IME-Mode", "Disabled"); // metode input pengaturan CSS tidak tersedia
Tujuan dari kode di atas adalah: hanya 0-9 angka dan titik desimal yang dapat dimasukkan.
Encapsulate Acara DomContentloaded
Salinan kode adalah sebagai berikut:
// Simpan antrian acara Domready
EventQueue = [];
// menilai apakah DOM telah dimuat
isready = false;
// menilai apakah domready terikat
isBind = false;
/*Jalankan domready ()
*
*@param {function}
*@Execute mendorong event handler ke antrian acara dan mengikat domcontentloaded
* Jika pemuatan DOM telah selesai, segera jalankan
*@penelepon
*/
function domready (fn) {
if (isready) {
fn.call (jendela);
}
kalau tidak{
Eventqueue.push (fn);
};
bindready ();
};
/*mengikat acara domready
*
*@param null
*@Jalankan browser modern mengikat domContentloaded melalui addevListener, termasuk IE9+
IE6-8 menentukan apakah DOM telah dimuat dengan menilai doscroll
*@caller domready ()
*/
function bindReady () {
if (isready) kembali;
if (isBind) kembali;
isBind = true;
if (window.addeventListener) {
document.addeventListener ('domcontentloaded', execfn, false);
}
lain if (window.attachevent) {
doscroll ();
};
};
/*Doscroll menentukan apakah DOM IE6-8 telah dimuat.
*
*@param null
*@Execute Doscroll menentukan apakah DOM memuat
*@penelepon bindready ()
*/
fungsi doscroll () {
mencoba{
document.documentelement.doscroll ('kiri');
}
catch (error) {
kembalikan setTimeout (doscroll, 20);
};
execfn ();
};
/*Antrian Acara Eksekusi
*
*@param null
*@Execute Loop Execution Event Handler di Antrian
*@penelepon bindready ()
*/
fungsi execFn () {
if (! isready) {
isready = true;
untuk (var i = 0; i <eventqueue.length; i ++) {
EventQueue [i] .call (window);
};
EventQueue = [];
};
};
// file js 1
domready (function () {
});
// file js 2
domready (function () {
});
// Perhatikan bahwa jika dimuat secara tidak sinkron, jangan mengikat metode domready, jika tidak fungsi tidak akan dieksekusi.
// Karena sebelum unduhan JS yang memuat asinkron, domcontentloaded telah dipecat, dan addeventListener tidak dapat didengarkan saat mengeksekusi
Enkapsulasi sederhana Ajax menggunakan JS asli
Pertama, kita membutuhkan objek XHR. Ini tidak sulit bagi kita, merangkumnya menjadi suatu fungsi.
Salinan kode adalah sebagai berikut:
var createajax = function () {
var xhr = null;
mencoba {
// IE Seri Browser
xhr = ActivexObject baru ("microsoft.xmlhttp");
} catch (e1) {
mencoba {
// bukan yaitu browser
xhr = xmlhttpRequest baru ();
} catch (e2) {
window.alert ("Browser Anda tidak mendukung Ajax, harap ganti!");
}
}
mengembalikan xhr;
};
Lalu, mari kita tulis fungsi inti.
Salinan kode adalah sebagai berikut:
var ajax = function (conf) {
// Inisialisasi
// Ketik parameter, opsional
var type = conf.type;
// Parameter URL, diperlukan
var url = conf.url;
// Parameter data adalah opsional, hanya diperlukan saat meminta posting
var data = conf.data;
// Parameter Tipe adalah opsional
var DataType = conf.datatype;
// fungsi panggilan balik adalah opsional
var Success = conf.success;
if (type == null) {
// Parameter tipe adalah opsional, default didapat
type = "get";
}
if (DataType == null) {
// Parameter Tipe adalah opsional, default ke teks
DataType = "Teks";
}
// Buat Objek Mesin AJAX
var xhr = createajax ();
// Membuka
xhr.open (tipe, url, true);
// mengirim
if (type == "get" || type == "get") {
xhr.send (null);
} lain jika (type == "post" || type == "post") {
xhr.setrequestheader ("tipe konten",
"Aplikasi/X-WWW-Form-Urlencoded");
xhr.send (data);
}
xhr.onreadystatechange = function () {
if (xhr.readystate == 4 && xhr.status == 200) {
if (datatype == "Text" || DataType == "Text") {
if (sukses! = null) {
// teks normal
sukses (xhr.responsetext);
}
} else if (DataType == "xml" || dataType == "xml") {
if (sukses! = null) {
// Terima dokumen XML
sukses (xhr.responsexml);
}
} else if (datatype == "json" || dataType == "json") {
if (sukses! = null) {
// Konversi string JSON ke objek JS
sukses (eval ("("+xhr.Responsetext+")"));
}
}
}
};
};
Akhirnya, mari kita jelaskan penggunaan fungsi ini.
Salinan kode adalah sebagai berikut:
AJAX ({
Ketik: "Posting",
URL: "test.jsp",
Data: "Name = Dipoo & Info = Good",
DataType: "JSON",
Sukses: function (data) {
peringatan (data.name);
}
});
Permintaan silang domain JSONP
Salinan kode adalah sebagai berikut:
/**
* JavaScript JSONP Library v0.3
* Hak Cipta (C) 2011 Snandy
* QQ Group: 34580561
* Tanggal: 2011-04-26
*
* Tingkatkan penanganan kegagalan permintaan. Meskipun fungsi ini tidak terlalu berguna, perbedaan dalam skrip di setiap browser dipelajari.
* 1, IE6/7/8 OnReadyStateChange Event yang mendukung skrip
* 2, IE9/10 mendukung acara Onload dan OnReadyStateChange
* 3, Firefox/Safari/Chrome/Opera mendukung acara Onload Script
* 4, IE6/7/8/Opera tidak mendukung acara OnError skrip; IE9/10/dukungan firefox/safari/chrome
* 5. Meskipun Opera tidak mendukung acara OnReadyStateChange, ia memiliki properti ReadyState. Ini sangat ajaib
* 6. Tes IE6/7/8 dengan IE9 dan Ietester, dan ReadyState selalu dimuat dan dimuat. Tidak ada lengkap yang muncul.
*
* Ide implementasi akhir:
* 1, IE9/Firefox/Safari/Chrome berhasil menelepon kembali untuk menggunakan acara onload, dan callback kesalahan menggunakan acara Onerror
* 2, Opera berhasil Callback juga menggunakan acara Onload (tidak mendukung OnReadyStateChange sama sekali). Karena tidak mendukung OnError, pemrosesan penundaan digunakan di sini.
* Yaitu, menunggu kesuksesan dan berhasil panggilan balik, dan bendera bendera yang dilakukan setelah kesuksesan diatur ke true. Kegagalan tidak akan dieksekusi, jika tidak itu akan dieksekusi.
* Sangat terampil untuk mengambil nilai waktu yang tertunda di sini. Dibutuhkan 2 detik sebelumnya, dan tidak ada masalah dalam pengujian perusahaan. Tetapi setelah pulang untuk menggunakan jaringan nirkabel 3G, saya menemukan bahwa meskipun file JS yang direferensikan ada, itu ada
* Kecepatan internet terlalu lambat, kegagalan dieksekusi terlebih dahulu dan kemudian sukses. Jadi lebih masuk akal untuk memakan waktu 5 detik di sini. Tentu saja, itu tidak mutlak.
* 3, IE6/7/8 Callbacks Sukses Gunakan acara OnReadyStateChange, dan callback kesalahan hampir sulit untuk diimplementasikan. Ini juga yang paling teknis.
* Referensi http://stackoverflow.com/questions/3483919/script-onload-onerror-with-iefor-lazy-loading-problems
* Menggunakan NextSibling, ditemukan bahwa itu tidak dapat diimplementasikan.
* Yang menjijikkan adalah bahwa bahkan jika file sumber daya yang diminta tidak ada. ReadyState -nya juga akan mengalami keadaan "dimuat". Dengan cara ini Anda tidak dapat mengetahui apakah permintaan itu berhasil atau gagal.
* Saya takut akan hal itu, jadi saya akhirnya menggunakan mekanisme koordinasi antara kantor depan dan belakang untuk menyelesaikan masalah akhir. Buat permintaan panggilan balik (benar) terlepas dari keberhasilan atau kegagalan.
* Pada saat ini, logika yang membedakan keberhasilan dan kegagalan telah dimasukkan ke dalam panggilan balik. Jika latar belakang tidak mengembalikan JSONP, hubungi kegagalan, jika tidak hubungi sukses.
*
*
* Antarmuka
* Sjax.load (url, {
* Data // Parameter Permintaan (Nilai Kunci Pair String atau Objek JS)
* Sukses // Meminta fungsi panggilan balik yang berhasil
* Kegagalan // Fungsi panggilan balik gagal
* Lingkup // Konteks Eksekusi Fungsi Callback
* Timestamp // Apakah akan menambahkan cap waktu
*});
*
*/
Sjax =
function (win) {
var IE678 =!-[1,],
opera = win.opera,
doc = win.document,
head = doc.geteLementsbyTagname ('head') [0],
Timeout = 3000,
selesai = false;
fungsi _serialize (obj) {
var a = [], kunci, val;
untuk (kunci dalam obj) {
val = obj [kunci];
if (val.constructor == array) {
untuk (var i = 0, len = val.length; i <len; i ++) {
A.push (key + '=' + encodeuricomponent (val [i]));
}
}kalau tidak{
A.push (tombol + '=' + encodeuricomponent (val));
}
}
return A.join ('&');
}
permintaan fungsi (url, opt) {
function fn () {}
var opt = opt || {},
data = opt.data,
Sukses = opt.success || fn,
kegagalan = opt.failure || fn,
scope = opt.scope || menang,
timestamp = opt.timestamp;
if (data && typeof data == 'objek') {
data = _serialize (data);
}
var skrip = doc.createelement ('skrip');
function callback (issucc) {
if (issucc) {
if (typeof jsonp! = 'tidak terdefinisi') {// jsonp di sebelah kanan penugasan harus dikembalikan di latar belakang, dan variabel ini adalah variabel global
selesai = benar;
Success.call (SCOPE, JSONP);
}kalau tidak{
failure.call (lingkup);
// peringatan ('peringatan: jsonp tidak kembali.');
}
}kalau tidak{
failure.call (lingkup);
}
// Tangani kebocoran memori di IE
script.onload = script.onError = script.onReadyStateChange = null;
jsonp = tidak terdefinisi;
if (head && script.parentnode) {
head.removechild (skrip);
}
}
Function FixonError () {
setTimeout (function () {
if (! Done) {
callback ();
}
}, timeout);
}
if (ie678) {
Script.onReadyStateChange = function () {
var readystate = this.readystate;
if (! Done && (readyState == 'Loaded' || readyState == 'complete')) {
callback (true);
}
}
// fixonError ();
}kalau tidak{
script.onload = function () {
callback (true);
}
script.onError = function () {
callback ();
}
if (opera) {
fixonerror ();
}
}
if (data) {
url += '?' + data;
}
if (timestamp) {
if (data) {
url += '& ts =';
}kalau tidak{
url += '? ts ='
}
url += (tanggal baru) .getTime ();
}
script.src = url;
head.insertbefore (skrip, head.firstchild);
}
return {load: request};
}(ini);
Metode panggilan adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
Sjax.load ('jsonp66.js', {
Success: function () {alert (jsonp.name)},
kegagalan: function () {waspada ('error');}
});
Pemformatan millometer
Salinan kode adalah sebagai berikut:
fungsi tothouse (num) {
var num = (num || 0) .toString (), result = '';
while (num.length> 3) {
hasil = ',' + num.slice (-3) + hasil;
num = num.slice (0, num.length - 3);
}
if (num) {result = num + hasil; }
hasil pengembalian;
}
Di atas adalah skrip JavaScript yang umum digunakan yang dibagikan oleh artikel ini. Saya harap Anda menyukai mereka.