jquery設置範圍

在我的應用程序中，我有特定於每個頁面的jquery，這是嚴格在一個頁面上使用的腳本。有沒有辦法設置我可以在其中工作的範圍，以避免任何id/class碰撞或行爲從一個頁面爬到另一個頁面？jquery設置範圍

我能做到這一點，例如通過指定包裝DIV的特定頁面

$(function(){ 
    $('#thing_page input.finder').focus(function(){ ... }) 
});

但我需要預先設置所有的事件綁定與頁包裝紙的名字，這是一個有點惱人。

對於那些不知道的人來說，rails將所有的javascript文件壓縮到一個，我喜歡。否則，我可以將每個文件包含在特定的頁面上。

來源

2012-01-11 recursive_acronym

我開始了一個非常類似於此前的討論。可能對你有幫助：http://stackoverflow.com/questions/7582176/managing-document-ready-events-on-a-large-scale-website – WickyNilliams 2012-01-11 15:41:51

您可以將其全部包裝在一個巨大的switch報表中。假設thing_page是爲body的ID，你可以這樣做：

$(function() { 
    switch (document.body.id) { 
     case 'thing_page': 
      // Do stuff for thing page 
      $('input.finder').focus(function(){ ... }); 
      break; 
     case 'other_page': 
      // do stuff for other page 
      break; 
     case 'third_page': 
      // Do stuff for third page 
      break; 
     // ...and so on and so forth... 
    } 
});

語法高亮這裏是非常糟糕的。看看它的jsfiddle：http://jsfiddle.net/dFuVz/

或者，你可以考慮使用一個對象來包含你的函數（類似@安德魯的做法）：

var pageFunctions = { 
    thing_page: function() { 
     // Code for thing_page 
     $('#thing_page input.finder').focus(function(){...}); 
    }, 
    other_page: function() { 
     // Code for other_page 
    }, 
    third_page: function() { 
     // Code for third_page 
    } 
}; 

// Now call the correct function, according to the body ID 
pageFunctions[ document.body.id ]();

同樣，由於語法高亮這裏是如此可怕，請看這裏：http://jsfiddle.net/9L592/

來源

2012-01-11 15:34:17

Silber先生的方法是完全有效的。在某種程度上，您可能希望調查JavaScript AMD作爲一種管理頁面特定小部件和需求的方式 - 這正是整個行業的普遍趨勢，而且這是一種加載所需內容的好方法。這是一個簡介：http://unscriptable.com/index.php/2011/09/22/amd-module-patterns-singleton/ – Nate 2012-01-11 15:44:30

因爲函數是JavaScript中的第一類，所以可以有效地將每個頁面的整個函數和變量包裝在一個對象中，然後調用該對象：

var allPages = { 
    thingPage : function() { 
     $('#thing_page input.finder').focus(function(){...}); 
    }, 
    nothingPage : { 
     index: 0, 
     removePost : function() { 
      $('#nothing_page .post').find('p').remove(); 
     } 
    } 
};

然後您可以通過調用allPages.thingPage()調用功能或allPages.nothingPage.index訪問的變量。

此外，請閱讀Douglas Crockford's article on Javascript code convention的「函數聲明」部分。特別是，「當一個函數被立即調用時，整個調用表達式應該被包裝在parens中，這樣就可以清楚地知道生成的值是函數的結果，而不是函數本身。」這種技術與我上面寫的相似，但可能更符合你應該做的事情。

來源

2012-01-11 15:53:40 Andrew

jquery設置範圍

回答

相關問題