Question

这个问题并不总是出现。如果我等待一段时间加载页面，或者如果我在两次点击之间等待更改此下拉菜单中的语言，它就可以正常工作。这是一个简单的多语言网站。

我在导航栏中的下拉显示如下：

    ....
    <li class="dropdown">  

    <a class="dropdown-toggle" data-toggle="dropdown" href="#"> <img src="Pictures/BR-US-SP.png"><b class="caret"></b></a>  
            <ul class="dropdown-menu" id="langMenu">  
                <li><a href="#" id="pt-BR" name="pt-BR" value="pt-BR"><img src="/Pictures/1383607461_Brazil.png"></a></li>
                <li><a href="#" id="en" name="en" value="en"><img src="/Pictures/1383615303_United-States.png"></a></li>  
                <li><a href="#" id="es" name="es" value="es"><img src="/Pictures/1383615325_Spain.png"></a></li>  
                <li class="divider"></li>  
            </ul>  
    </li> 
    ....

事件如下：

Template.navigation.events({
'click #langMenu': function(event){
        currentLang = $(event.target).attr('id');
  ...
   // So some stuff with and re-renders page upon value of currentLang //
  ...
 }
});

当它中断时，控制台显示变量currentLang未定义。所以我假设这是因为没有及时呈现模板以使click事件获取其值。这个假设是否正确？

如何确保始终获取currentLang值？

对不起。我花了几天时间已经把它搞砸了。然而，随着Meteor的发展如此之快，我发现并测试了许多可能的解决方案让我感到困惑，这些解决方案实际上没有用（不推荐使用？）。我不能通过Meteor Docs准确地了解如何使用Blaze函数，何时以及如何使用onRendered等等......有什么好的例子吗？

相反，我应该使用Iron Router使用完全不同的方法吗？如果是，那怎么办？

Answer 1

你必须阻止它。目前的ES5方法是

Template.navigation.events({
'click #langMenu': function(event){
        setTimeout(function(){
            currentLang = $(event.target).attr('id');
        },100)
 }
});

Answer 2

问题可能是点击功能的选择器。我这样做了：

Template.navigation.events({ 'click #langMenu>li': function(event){ currentLang = $(event.currentTarget).attr('id'); // Do stuff... } });

如何在单击事件之前等待渲染？

2 个答案: