欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JQuery 技巧和竅門整理(8個)

 更新時間：2010年04月22日 11:29:49   作者：  
JQuery 是一款快速、易于使用的 JavaScript 框架。芒果介紹幾個實(shí)用的 JQuery 技巧和竅門。
1. 新窗口打開鏈接
XHTML 1.0 Strict 版本不支持 target="_blank" 屬性，而使用 JQuery 能很好地解決這個問題，實(shí)現(xiàn)新窗口打開網(wǎng)頁：
復(fù)制代碼 代碼如下:

$('a[@rel$='external']').click(function(){
this.target = "_blank";
});

/*
Usage:
<a rel="external">mangguo.org</a>
*/

2. 獲得匹配元素的總數(shù)
以下代碼將返回匹配元素的數(shù)目：

$('element').size();

3. 預(yù)加載圖像
當(dāng)使用 Javascript 處理圖像載入時，可以使用圖像實(shí)現(xiàn)預(yù)加載：
復(fù)制代碼 代碼如下:

jQuery.preloadImages = function()
{
for(var i = 0; i").attr("src", arguments[i]);
}
};

// Usage
$.preloadImages("image1.gif", "/path/to/image2.png", "some/image3.jpg");

4. 檢測瀏覽器
根據(jù)不同瀏覽器加載不同 CSS 能防止因?yàn)g覽器差異造成的樣式表渲染差異，使用 JQuery 可以輕松實(shí)現(xiàn)：
復(fù)制代碼 代碼如下:

//A. Target Safari
if( $.browser.safari ) $("#menu li a").css("padding", "1em 1.2em" );

//B. Target anything above IE6
if ($.browser.msie && $.browser.version > 6 ) $("#menu li a").css("padding", "1em 1.8em" );

//C. Target IE6 and below
if ($.browser.msie && $.browser.version <= 6 ) $("#menu li a").css("padding", "1em 1.8em" );

//D. Target Firefox 2 and above
if ($.browser.mozilla && $.browser.version >= "1.8" ) $("#menu li a").css("padding", "1em 1.8em" );

5. 字符串替換
用 JQuery 能對文本內(nèi)容中的特定字符串進(jìn)行替換操作：
復(fù)制代碼 代碼如下:

var el = $('#id');
el.html(el.html().replace(/word/ig, ""));

6. 列高度相等
用 CSS 實(shí)現(xiàn)兩列高度相等并不容易，JQuery 能幫你解決：
復(fù)制代碼 代碼如下:

function equalHeight(group) {
tallest = 0;
group.each(function() {
thisHeight = $(this).height();
if(thisHeight > tallest) {
tallest = thisHeight;
}
});
group.height(tallest);
}

/*
Usage:
$(document).ready(function() {
equalHeight($(".recent-article"));
equalHeight($(".footer-col"));
});
*/

7. 字體大小重設(shè)
字體大小重設(shè)是一個非常常用的功能：
復(fù)制代碼 代碼如下:

$(document).ready(function(){
// Reset Font Size
var originalFontSize = $('html').css('font-size');
$(".resetFont").click(function(){
$('html').css('font-size', originalFontSize);
});
// Increase Font Size
$(".increaseFont").click(function(){
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*1.2;
$('html').css('font-size', newFontSize);
return false;
});
// Decrease Font Size
$(".decreaseFont").click(function(){
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*0.8;
$('html').css('font-size', newFontSize);
return false;
});
});

8. 禁用右鍵菜單
有許多 JavaScript 代碼段可禁用右鍵菜單，但 JQuery 使操作變得更容易：
復(fù)制代碼 代碼如下:

$(document).ready(function(){
$(document).bind("contextmenu",function(e){
return false;
});
});

相關(guān)文章

  • jquery實(shí)現(xiàn)將獲取的顏色值轉(zhuǎn)換為十六進(jìn)制形式的方法

    jquery實(shí)現(xiàn)將獲取的顏色值轉(zhuǎn)換為十六進(jìn)制形式的方法

    這篇文章主要介紹了jquery實(shí)現(xiàn)將獲取的顏色值轉(zhuǎn)換為十六進(jìn)制形式的方法,包含了完整的實(shí)例與關(guān)鍵代碼的注釋說明,并附帶了所需知識點(diǎn)的參考文章地址,具有一定的參考借鑒價值,需要的朋友可以參考下
    2014-12-12
  • jQuery實(shí)現(xiàn)簡單的文件上傳進(jìn)度條效果

    jQuery實(shí)現(xiàn)簡單的文件上傳進(jìn)度條效果

    這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)簡單的文件上傳進(jìn)度條效果，上傳文件時顯示上傳進(jìn)度條，以百分比的形式顯示上傳進(jìn)度，感興趣的小伙伴們可以參考一下
    2015-11-11
  • jquery實(shí)現(xiàn)擲骰子小游戲

    jquery實(shí)現(xiàn)擲骰子小游戲

    這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)擲骰子小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2019-10-10
  • jQuery過濾選擇器詳解

    jQuery過濾選擇器詳解

    本文主要給大家詳細(xì)介紹了jQuery過濾選擇器，包含基本過濾選擇器、內(nèi)容過濾選擇器、可見性過濾選擇器、屬性過濾選擇器、子元素過濾選擇器、表單對象屬性過濾選擇器等，十分全面,需要的朋友可以參考下
    2015-01-01
  • 使用CamanJS在Web頁面上處理圖像的技巧

    使用CamanJS在Web頁面上處理圖像的技巧

    CamanJs庫用于個人項(xiàng)目中進(jìn)行使用的圖形操作庫，這個庫是基于JavaScript的canvas操作庫，接下來，通過本篇文章給大家詳細(xì)介紹使用CamanJS在Web頁面上處理圖像的技巧，需要的朋友一起來學(xué)習(xí)下
    2015-08-08
  • JQuery手速測試小游戲?qū)崿F(xiàn)思路詳解

    JQuery手速測試小游戲?qū)崿F(xiàn)思路詳解

    這篇文章主要介紹了JQuery手速測試小游戲?qū)崿F(xiàn)思路詳解,本文給大家介紹的非常詳細(xì)，具有參考借鑒價值，需要的朋友可以參考下
    2016-09-09
  • 使用jquery修改表單的提交地址基本思路

    使用jquery修改表單的提交地址基本思路

    使用jquery選擇器得到對應(yīng)表單的jquery對象，然后使用attr方法修改對應(yīng)的action,需要的朋友可以參考下
    2014-06-06
  • jquery checkbox實(shí)現(xiàn)單選小例

    jquery checkbox實(shí)現(xiàn)單選小例

    checkbox是復(fù)選框如何將其變?yōu)閱芜x呢？下面有個不錯的示例，感興趣的朋友可以參考下
    2013-11-11
  • jQuery實(shí)現(xiàn)帶延遲的二級tab切換下拉列表效果

    jQuery實(shí)現(xiàn)帶延遲的二級tab切換下拉列表效果

    這篇文章主要介紹了jQuery實(shí)現(xiàn)帶延遲的二級tab切換下拉列表效果,涉及jquery鼠標(biāo)事件及頁面元素樣式動態(tài)變換的實(shí)現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-09-09
  • jquery插件實(shí)現(xiàn)掃雷游戲(1)

    jquery插件實(shí)現(xiàn)掃雷游戲(1)

    這篇文章主要為大家詳細(xì)介紹了jquery插件實(shí)現(xiàn)掃雷游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2021-04-04

最新評論