1
我能做些什麼來加快它的速度？或者有沒有你注意到的新手錯誤？我的jQuery運行速度有點慢。我如何加快速度？
我注意到我重複了很多變量。這樣我就不必寫出每一行，但我不確定是否有更好的解決方案？
該問題通常發生在切換回標籤後不在上面。它需要幾秒鐘點擊外環來響應，但這很好。幾乎就像剩下的代碼運行它需要重寫？我不確定，但如果有經驗的用戶能夠在我的代碼中看到可以改進的東西，我會很高興。
這裏有一個工作jsFiddle http://jsfiddle.net/eA6x6/1/，以下是我的JavaScript代碼的完整。
jQuery(document).ready(function() {
var timeoutHandle;
// hide stuff
var hideServices = function() {
jQuery(".services-inner").css({"opacity": "0"});
jQuery(".insignia-inner").css({"opacity": "0"});
jQuery(".insignia-inner-text").css({"opacity": "0"});
};
var hideAll = function() {
jQuery(".military-kit-inner").css({"opacity": "0"});
jQuery(".property-inner").css({"opacity": "0"});
jQuery(".home-contents-inner").css({"opacity": "0"});
jQuery(".travel-inner").css({"opacity": "0"});
jQuery(".events-inner").css({"opacity": "0"});
jQuery(".adventurous-training-inner").css({"opacity": "0"});
jQuery(".personal-injury-inner").css({"opacity": "0"});
jQuery(".challenge-pursuits-inner").css({"opacity": "0"});
jQuery(".sports-and-tours-inner").css({"opacity": "0"});
jQuery(".winter-sports-inner").css({"opacity": "0"});
jQuery(".now-available").css({"opacity": "0"});
jQuery(".now-available-background").css({"opacity": "0"});
jQuery(".launched-shortly").css({"opacity": "0"});
jQuery(".launched-shortly-background").css({"opacity": "0"});
};
var showServicesDelay = function() {
timeoutHandle = setTimeout(function() {
jQuery(".services-inner").css({"opacity": "0.5"});
jQuery(".insignia-inner").css({"opacity": "1"});
jQuery(".insignia-inner-text").css({"opacity": "1"});
hideAll();
}, 5000);
};
// show messages
var showLaunchedShortly = function() {
jQuery(".launched-shortly").css({"opacity": "1"});
jQuery(".launched-shortly-background").css({"opacity": "1"});
};
var showNowAvailable = function() {
jQuery(".now-available").css({"opacity": "1"});
jQuery(".now-available-background").css({"opacity": "1"});
};
// show services
var showMilitaryKit = function() {
jQuery(".military-kit-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showProperty = function() {
jQuery(".property-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showHomeContents = function() {
jQuery(".home-contents-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showTravel = function() {
jQuery(".travel-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showEvents = function() {
jQuery(".events-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showAdventurousTraining = function() {
jQuery(".adventurous-training-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showPersonalInjury = function() {
jQuery(".personal-injury-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showChallengePursuits = function() {
jQuery(".challenge-pursuits-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showSportsAndTours = function() {
jQuery(".sports-and-tours-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showWinterSports = function() {
jQuery(".winter-sports-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
// military kit
jQuery(".military-kit-hover").click(function() {
hideAll();
hideServices();
showMilitaryKit();
showServicesDelay();
showNowAvailable();
});
// property
jQuery(".property-hover").click(function() {
hideAll();
hideServices();
showProperty();
showServicesDelay();
showNowAvailable();
});
// home contents
jQuery(".home-contents-hover").click(function() {
hideAll();
hideServices();
showHomeContents();
showServicesDelay();
showNowAvailable();
});
// travel
jQuery(".travel-hover").click(function() {
hideAll();
hideServices();
showTravel();
showServicesDelay();
showNowAvailable();
});
// events
jQuery(".events-hover").click(function() {
hideAll();
hideServices();
showEvents();
showServicesDelay();
showLaunchedShortly();
});
// adventurous training
jQuery(".adventurous-training-hover").click(function() {
hideAll();
hideServices();
showAdventurousTraining();
showServicesDelay();
showLaunchedShortly();
});
// personal injury
jQuery(".personal-injury-hover").click(function() {
hideAll();
hideServices();
showPersonalInjury();
showServicesDelay();
showNowAvailable();
});
// challenge pursuits
jQuery(".challenge-pursuits-hover").click(function() {
hideAll();
hideServices();
showChallengePursuits();
showServicesDelay();
showNowAvailable();
});
// sports and tours
jQuery(".sports-and-tours-hover").click(function() {
hideAll();
hideServices();
showSportsAndTours();
showServicesDelay();
showLaunchedShortly();
});
// winter sports
jQuery(".winter-sports-hover").click(function() {
hideAll();
hideServices();
showWinterSports();
showServicesDelay();
showLaunchedShortly();
});
});
事情會很多如果您將補充類添加到在類似情況下顯示/隱藏的元素，則更簡單。這樣你只需要一個選擇器。 – Pointy
這是一個選項卡式界面嗎？如果是的話，你可能會將代碼降低到15行左右。 –