具有onfocus的流星afQuickField无法找到功能

时间:2017-05-05 07:24:52

标签: javascript meteor onfocus

我试图实现一个动态帮助字段,当焦点随Meteor AutoForms改变时会改变(类似于"类似问题"当你在这里提问时右边出现的框) 。但是当该字段获得焦点时,我得到了#34; ReferenceError:未定义myFunc"。

我尝试将myFunc定义为我的.js文件中的非包装函数和模板帮助器,并在.html文件中定义为<script>包装函数,甚至作为内联函数作为onfocus的一部分(由于它无法找到.js文件中的标题和文本数组,因此非常难看并失败),但仍然会获得ReferenceError。与onclick相同的问题。我还尝试过模板焦点或点击事件(这个事件永远不会触发)

以下示例代码。为清晰起见,我遗漏了所有<div>s,但表单在实际代码中正确显示,只是onfocus属性不起作用。

html的

<template name="updateProfileForm">
    {{#autoForm id="updateProfileForm" collection="Meteor.users" doc=currentUser type="update"}}
    {{> afQuickField
        name="emails.1.address"
        id="secondaryEmail"
        label='Secondary Email'
        onfocus='ProfileUpdateHelp("secondary")'}}
</template>

的.js

    Template.updateProfileForm.helpers ({
      ProfileUpdateHelp: function(fieldName) {
       // console.log("This:", this);
       //  console.log("instance():", instance());
        TemplateVar.set('helpTitle', profileUpdateHelpTitles[fieldName]);
        TemplateVar.set('helpText', profileUpdateHelpTexts[fieldName]);
      },
    });

profileUpdateHelpTitles = {
  primary: "Primary email address",
  secondary: "Secondary email address",
};
profileUpdateHelpTexts = {
  primary: "Primary email address help",
  secondary: "Secondary email address help",
};

我也尝试了一些事件,但没有一个事件发生(我预计所有3个事件都会发生):

Template.updateProfileForm.events({
    "click #secondaryEmail": function(e) {
        alert("Click");
    },
    "focus #secondaryEmail": function(e) {
        alert("focus");
    },
    "blur #secondaryEmail": function(e) {
        alert("blur");
    }, 
}); 

1 个答案:

答案 0 :(得分:1)

<强>成功!!!

所以问题比没有解雇的事件大得多。 .js文件中的事件或帮助程序都没有被执行。问题结果是我尝试添加对prerender.io的支持。 prerenderio对象没有被定义,所以对它的引用是错误的。为什么这导致模板助手和事件无法在不同的文件中工作我猜测与加载顺序有关。但删除对未定义对象的引用会导致我的帮助程序和事件开始工作!

修改

事实证明,删除未定义的对象并不是我所做的唯一改变,实际上并不是修复。我也宣布了

import { Template } from 'Meteor/Meteor'

这显然不是从哪里导入的。这导致模板成为&#34;其他东西&#34;这导致任何以Template开头的东西。 (助手,事件等)变得不存在。正确的导入当然是

import { Template } from 'meteor/templating';

如果有人理解为什么错误的导入行为的技术细节(没有编译或运行时错误),请留下评论以启发我们其他人。感谢。

结束编辑

对于任何来这里寻找如何让onfocus工作的人都是代码。这将触发所有输入字段以及表单中包含的按钮。如果只需要一个输入字段,则使用#fieldId而不是#formId。

Template.updateProfileForm.events({
  "focus #updateProfileForm": function(e) {
    const fieldId = e.target.id;
  },
});