只對某些頁面執行jQuery效果/操作

直到現在我已經把所有的jQuery代碼放在document.ready函數中。我在想，在某些情況下這不是最好的選擇。只對某些頁面執行jQuery效果/操作

例如：如果我想在某個頁面加載時執行動畫，那麼最好的方法是去做什麼。

$(document).ready(function() { 
    $("#element_1").fadeIn(); 
    $("#element_2").delay('100').fadeIn(); 
    $("#element_3").delay('200').fadeIn(); 
});

如果這是正確的內部則每次任何頁面加載它要檢查每一行，並尋找該元素的document.ready的。告訴jquery只在特定頁面上執行一段代碼以避免此問題的最佳方式是什麼？

來源

2010-04-30 Galen

通過檢查elememt存在於頁面上之前執行的動畫

if ($("#element-1").length) { 
    $("#element-1").fadeIn(); 
}

與其他元素

等#element_2和#element_3

到@numediaweb：

當前的jQuery is()實施就像下面那樣

is: function(selector) { 
    return !!selector && jQuery.filter(selector, this).length > 0; 
},

因此，它可以更明智使用is()，但它是更快地使用剛剛length甚至更快起訴document.getElementById().length

來源

2010-04-30 16:04:06

因此，爲了避免重複，我可以只對每個頁面的主體元素一個唯一的ID和檢查是否存在！ – Galen 2010-04-30 16:20:27

是的，你是對的！ – 2010-04-30 16:21:15

更好的方法是[將類屬性設置爲您的身體標記]（http://stackoverflow.com/questions/9578348/best-way-to-execute-js-only-on-specific-page/9578898#9578898 ） – numediaweb 2014-04-13 13:09:31

只包括你希望在DOM準備好爲要執行的代碼特定頁面。 $(document).ready(...並不意味着您應該在每個頁面上運行相同的代碼塊。這將需要執行各種檢查以瞭解需要執行的內容。

我確定您將擁有一些您希望在每個頁面上執行的常用功能，以及一些頁面特定的功能。如果是這種情況，那麼您可以將通用功能放入單一功能中，並從$(document).ready(...中調用該功能，以使剩下的唯一代碼專用於該特定頁面。例如：

function common() { 
    alert('hello'); 
} 

$(document).ready(function() { 
    common(); 
    // do some page-specific stuff 
});

我不同意在每一頁上執行各種檢查，以便代碼知道我們在哪裏。這似乎很麻煩的，完全可以避免的，比如：

function doAnimation() { 
    $("#element_1").fadeIn(); 
    $("#element_2").delay('100').fadeIn(); 
    $("#element_3").delay('200').fadeIn(); 
} 

$(document).ready(function() { 
    if(window.location.href == 'http://example.com/foo') { 
     doAnimation(); 
    } 
    if(this page has blah) { 
     doBlah(); 
    } 
});

理想的情況下，它應該是是：

$(document).ready(function() { 
    // do stuff for foo.php 
});

來源

2010-04-30 16:27:18 karim79

你是否建議爲每個頁面使用不同的js文件？ – Galen 2010-04-30 17:33:10

@Galen - 是的，有點。我試圖鼓勵你只在需要的地方使用代碼，而不是把條件放在需要執行的地方。 – karim79 2010-04-30 18:56:30

只對某些頁面執行jQuery效果/操作

回答

相關問題