jQuery事件在流星JS车把内不起作用

Question

我必须根据用户配置文件显示div，两个div都按预期方式显示，但jquery事件（在单独的文件中）不起作用，但是如果我删除“ if else condition”，则jquery事件可以正常工作，谢谢。

我试图将divs放到新模板中，但是它也不起作用。

<!-- home profile template -->
{{# if bandprofile  currentUser.profile.type }}
      <div id="bandnamediv" class="userinforow">
        <span>Band name:</span>
        <input type="text" id="bandnameinput" class="oldinfo bld " value="   {{currentUser.profile.bandName}}"/>
       <span class="savebandname">save</span>
    </div>
{{/if}}
{{# if userprofile currentUser.profile.type }}
       <div id="firstnamediv" class="userinforow">
          <span class="oldinfo bld">First name: </span>
          <input type="text" id="firstnameinput" class="oldinfo" value="{{currentUser.profile.firstname}}"/>
         <span class="savefirstname bld oldinfo">save</span>
       </div>
 {{/if}}
 <!--end home profile template--> 

模板助手

Template.homeprofile.helpers({ 
    bandprofile: function(usertype){ 
      if(usertype === "band") { return true; }
      else {return false;} 
  },
  userprofile: function(usertype){
   if(usertype === "costumer"){ return true; }
   else  {return false;}
 }
 });

外部jquery文件：

$('.savefirstname').click(function(){
    alert('save first name');
    /*other things*/
 });
 $('.savebandname').click(function(){
    alert('save band name');
    /*other things*/
 });

Answer 1

我建议您改用事件 。 根据流星命名约定，它可能更容易阅读。

Template.homeprofile.events({
  'click .savefirstname': function(e, template){
        alert('save first name');
        /*other things*/
  }
  'click .savebandname': function(e, template){
      alert('save band name');
      /*other things*/
  }
});

从文档 。

事件映射是一个对象，其中属性指定一组要处理的事件，而值是这些事件的处理程序。

...

事件类型及其用途包括： 单击 ， 更改 ， 焦点 ， 模糊 ...

因此，是的，我想说的是，事件应该包含在Template.homeprofile.events ，具体取决于您在问题中定义的前提（尝试在其中绑定事件）（ click ）。

否则，如果您确实想将jQuery用于事件，则可以使用on代替click 。 流星动态呈现内容，这可能就是事件侦听器未选择内容的原因。

$('body').on('click', '.savefirstname', function(){
    alert('save first name');
    /*other things*/
 });

$('body').on('click', '.savebandname', function(){
    alert('save band name');
    /*other things*/
 });