jQuery中的函數範圍

我在我的HTML文件頂部的<script>標記中有此代碼。jQuery中的函數範圍

$(document).ready(function() 
{ 
    $('#scrollbar1').tinyscrollbar(); 
    $('a.jqtree_common').click(updateScrollbar()); 
}); 

$(function updateScrollbar() 
{ 
    var oScrollbar = $('#scrollbar1'); 
    oScrollbar.tinyscrollbar(); 
    oScrollbar.tinyscrollbar_update(); 

    $('a.jqtree_common').click(updateScrollbar()); 
});

但由於某些原因，當我運行它，它說updateScrollbar()是內(document).ready不確定的。當我嘗試在(document).ready內部定義updateScrollBar()時，updateScrollBar()會陷入某種無限循環。

我的問題是雙重的：

我能做些什麼，以使(document).ready範圍內定義updateScrollBar()？
有沒有更好的方法將這個函數分配給'a.jqtree_common'元素？它們在運行時動態創建，並在使用網頁時進行修改。我希望函數每次點擊其中一個時就運行。

我使用微小scrollbar和jqtree

編輯：我想提出的$('a.jqtree_common').click(updateScrollbar);分配每滾動更新時，因爲我相信'a.jqtree_common'元素上單擊創建更'a.jqtree_common'元素。

來源

2013-05-28 caps

只是刪除了'$（'和'）'周圍的功能。 DOM不需要準備好聲明該函數。 – Paulpro

當使用事件綁定時，該函數不需要（），或者當瀏覽器讀取該行時將被調用。 –

@caps我們必須使用這個'.on（'綁定動態元素的函數 –

這是最終爲我工作：

$(document).ready(function() 
{ 
    $('#scrollbar1').tinyscrollbar(); 
    $('a.jqtree_common').click(updateScrollbar); 

    function updateScrollbar() 
    { 
     var oScrollbar = $('#scrollbar1'); 
     oScrollbar.tinyscrollbar(); 
     oScrollbar.tinyscrollbar_update(); 

     $('a.jqtree_common').click(updateScrollbar); 
    } 
});

來源

2013-05-29 00:09:25 caps

試試這個代碼：

$(document).ready(function() { 

    var updateScrollbar = function() { 
     var oScrollbar = $('#scrollbar1'); 
     oScrollbar.tinyscrollbar(); 
     oScrollbar.tinyscrollbar_update(); 
    }; 

    $('#scrollbar1').tinyscrollbar(); 
    $('a.jqtree_common').click(updateScrollbar).click(); 
});

來源

2013-05-28 22:35:03 Kenneth

'$（'a.jqtree_common'）。click（updateScrollbar（））;'應該是'$（'a .jqtree_common'）。click（updateScrollbar）;' –

對你的JS進行了小改動，另外，我傾向於依賴函數提升來將我的函數定義放在我的事件綁定下面，但是沒有改變這個。 – Tracker1

在這種情況下，起重功能不起作用。只有變量'updateScollbar'被提升，而不是值。 – Kenneth

傳遞，而不是在Click事件的函數的結果的函數引用作爲回調。 ()將調用該函數並將結果設置爲回調函數，該回調函數將再次調用它內部的updatescrollbar並進入無限循環。

$(document).ready(function() 
{ 
    $('#scrollbar1').tinyscrollbar(); 
    $('a.jqtree_common').click(updateScrollbar); 
}); 

function updateScrollbar() 
{ 
    var oScrollbar = $('#scrollbar1'); 
    oScrollbar.tinyscrollbar(); 
    oScrollbar.tinyscrollbar_update(); 

    //$('a.jqtree_common').click(updateScrollbar); 
}

來源

2013-05-28 22:35:34 PSL

@JuanMendes沒有幫到你？ – PSL

範圍仍需要修復。你需要刪除函數updateScrollbar（）之前的'$（''''，''和''''''''''）。 – Paulpro

@JuanMendes當你設置評論時，我可能會打字。 – PSL

要綁定加載後，我們必須使用這個.on(功能

$(document).ready(function(){ 
$('#scrollbar1').tinyscrollbar(); 
$(document).on("click","a.jqtree_common", updateScrollbar); 
}); 


function updateScrollbar(){ 
var oScrollbar = $('#scrollbar1'); 
oScrollbar.tinyscrollbar(); 
oScrollbar.tinyscrollbar_update(); 
}

元素，如果你想的範圍限制，然後在塊內聲明函數

$(document).ready(function(){ 
$('#scrollbar1').tinyscrollbar(); 
$(document).on("click","a.jqtree_common", updateScrollbar); 

function updateScrollbar(){ 
    var oScrollbar = $('#scrollbar1'); 
    oScrollbar.tinyscrollbar(); 
    oScrollbar.tinyscrollbar_update(); 
} 

});

來源

2013-05-28 22:38:03

我嘗試了這兩種方法，但都沒有爲我工作。 – caps

我可以看到小提琴 –

@caps在這裏看到這個jsfiddle.net/t69me/1它工作'.on' –

好吧，我知道有在這一點上的戒指很多，但這裏是我的條目...

//IMMEDIATELY-INVOKED FUNCTION EXPRESSION (IIFE) 
// Used for privacy/variable scoping 
(function(){ 

    //bind init function to dom-ready event 
    $(init); //same as $(document).ready(init); 

    //initialize event bindings for page 
    function init() { 
    //initialize scrollbar 
    $('#scrollbar1').tinyscrollbar(); 

    //click binding for tree 
    $('a.jqtree_common').click(updateScrollbar); 

    //assuming you want to run the updateScrollbar on page load 
    //in addition to clicks 
    updateScrollbar(); 
    } 

    //handles scrollbar updates 
    function updateScrollbar() { 
    //assuming the tinyscrollbar() initialization only needs 
    //to happen once, inside the initialization event. 
    $('#scrollbar1').tinyscrollbar_update(); 
    } 

}());

上面的結構幾乎是我如何處理事情......我首先執行變量，然後在頂部執行事件綁定，然後在下面執行我的函數聲明。這是因爲函數提升（在JS的編譯中，函數聲明移動到頂部），這對於函數賦值不起作用（例如：var x = function(){...}），然後我把整個東西包裝在IIFE中。我發現這個結構提供了更容易的可讀性和理解。我不喜歡把我的綁定放在底部，因爲我發現你必須經歷很多才能找到你想要的東西。

來源

2013-05-28 22:47:33 Tracker1

jQuery中的函數範圍

回答

相關問題