javascript - 使用带有 meteor 的 jQuery 会出现错误

Question

省略 keydown 输入 : function(event) { 和 } 会给我一个错误，类似于“构建应用程序时:
client/client.js:33:11:意外的 token (” 这基本上是开始。我想知道为什么我一开始就需要 javascript 函数。为了不出现错误。这是一个问题，特别是因为我不希望每次按下按键时都运行单击功能。无论如何，如果能弄清楚如何在此处使用 jQuery 而不是 javascript，或者更改 keydown 输入，那就太好了。

Template.create_poll.events = {

  'keydown input' : function(event) {

    $("input").keypress(function() {
      var active_element = $(this).parent().attr("id");
      var last_child = $('ul li:last').attr("id");
      var option_number_index = last_child.lastIndexOf("-");
      var option_number = last_child.substring(option_number_index+1);
      option_number = option_number/1;

        //console.log(option_number);

        //console.log(last_child);
      if (last_child == active_element) {
        console.log(active_element);
        option_number += 1;
        console.log(option_number);
        $('ul').append('<li id="poll-choice-' +  option_number + '"><input name="choice" type="text" placeholder="Option ' + option_number + '">');
      }
    }); 


    $("#poll_create").click(function() {
      console.log("Button works");
      var choices = new Array();
      var counter = 0;
      $("ul li input").each(function() {
        choices[counter] = $(this).val();
        counter++;
      });

      console.log(choices[1]);
      console.log(choices[5]);

    });

  }



}

Answer 1

Template.create_poll.events预计 eventMap这是:

An event map is an object where the properties specify a set of events to handle, and the values are the handlers for those events. The property can be in one of several forms:

因此，您需要传入 'keydown input' : function (event, templ) { ... } 以使其成为有效的 Javascript 对象。

在这种情况下，您应该遵循 @Cuberto 的建议并使用 Meteor 的事件映射来实现事件:

Template.create_poll.events = {

  'press input' : function(event) { 
      var active_element = $(this).parent().attr("id");
      var last_child = $('ul li:last').attr("id");
      var option_number_index = last_child.lastIndexOf("-");
      var option_number = last_child.substring(option_number_index+1);
      option_number = option_number/1;

        //console.log(option_number);

        //console.log(last_child);
      if (last_child == active_element) {
        console.log(active_element);
        option_number += 1;
        console.log(option_number);
        $('ul').append('<li id="poll-choice-' +  option_number + '"><input name="choice" type="text" placeholder="Option ' + option_number + '">');
      }
  },
  'click #poll_create' : function (event) {
      console.log("Button works");
      var choices = new Array();
      var counter = 0;
      $("ul li input").each(function() {
        choices[counter] = $(this).val();
        counter++;
      });

      console.log(choices[1]);
      console.log(choices[5]);

    }
}

但是，如果您想使用某些 jQuery 特定事件，则可以将它们附加到 rendered 函数中:

Template.create_poll.rendered = function () {
     $("input").keypress(function() {
      var active_element = $(this).parent().attr("id");
      var last_child = $('ul li:last').attr("id");
      var option_number_index = last_child.lastIndexOf("-");
      var option_number = last_child.substring(option_number_index+1);
      option_number = option_number/1;

        //console.log(option_number);

        //console.log(last_child);
      if (last_child == active_element) {
        console.log(active_element);
        option_number += 1;
        console.log(option_number);
        $('ul').append('<li id="poll-choice-' +  option_number + '"><input name="choice" type="text" placeholder="Option ' + option_number + '">');
      }
    }); 


    $("#poll_create").click(function() {
      console.log("Button works");
      var choices = new Array();
      var counter = 0;
      $("ul li input").each(function() {
        choices[counter] = $(this).val();
        counter++;
      });

      console.log(choices[1]);
      console.log(choices[5]);

    });
};