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中的函数范围

回答

相关问题