这是我的要求。

当我单击HTML中的按钮时
应该从JavaScript调用一种方法。该方法必须
返回一个可以在HTML页面中打印的值。

请指教。

<body>
<button class="test"> TEST !!!</button>
<li>{{test}}</li> // This value keep on change when i click the button
</body>

 JS:Template.body.events({
'click .test': function ()
 {
 userName=random value;
 return userName;
 }
});

最佳答案

尝试这个:

HTML:

<body>
  <button class="test"> TEST !!!</button>
  <p>{{test}}</p> // This value keep on change when i click the button
</body>


JS:

Template.body.helpers({
  test: function() {
    return Session.get('randomValue');
  }
});

Template.body.events({
  'click .test': function(evt, tpl) {
    Session.set('randomValue', (Math.random() * 100).toFixed(0));
  }
});


我建议您查看Meteor的官方教程:https://www.meteor.com/tutorials/blaze/creating-an-app

编辑:您可以在不使用全局Session变量的情况下进行操作。您可以使用reactive-var包。

将react-var软件包添加到您的项目中:

meteor add reactive-var


您的JS文件:

function generateRandomNum() {
  return (Math.random() * 100).toFixed(0);
}

Template.body.onCreated(function() {
  //set default value of reactive var
  this.randomValue = new ReactiveVar(generateRandomNum());
});

Template.body.helpers({
  test: function() {
    return Template.instance().randomValue.get();
  }
});

Template.body.events({
  'click .test': function(evt, tpl) {
    tpl.randomValue.set(generateRandomNum());
  }
});


阅读有关范围反应性的更多信息:https://dweldon.silvrback.com/scoped-reactivity

在文档中阅读有关ReactiveVar的更多信息:http://docs.meteor.com/#/full/reactivevar

关于javascript - 使用 meteor 在主体中添加按钮并从JS函数获取值,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31098203/

10-10 14:37
查看更多