Question

我的目的是在提交过程中发生错误时插入警告div。

if error
  # Remove div if already exisits
  if $('.alert').length
    $('.alert').remove()

  warning = "<div class=\"alert alert-danger\">#{error.reason}</div>"
  $(warning).insertBefore ".main"

但是，任何导航后警报div都不会消失。它只会在我刷新页面后消失。这里发生了什么？我试图用模板来解决这个问题，但我仍然想知道为什么会这样。

Answer 1

jQuery通常不知道实时DOM更新。 jQuery在文档准备好时解析，或者在事件发生时解析DOM的内容的某些预定义事件。但是当页面在jQuery范围之外更新时，它会丢失对DOM的跟踪。

为此，jQuery甚至还有live() API

的额外on() API和最近委派的事件

或者，您可以使用解决此问题的专用插件，例如Livequery

在Meteor中，您不应该像这样在外部添加/删除DOM元素。为此，您有declared templates, or the template API

在你的情况下，你可以很容易地定义一个布尔模板助手，并使用{{#if}}把手块来检查条件，以显示/隐藏错误div，如果错误是一般的错误。或者如果它是自定义错误，那么您可以将其注册为帮助程序。

<template name="errorDisplay">
  <div class="alert alert-danger">{errorMessage}</div>
</template>

和你的js

Template.errorDisplay.helpers({
  errorMessage: function() {
    return error && error.message;
  }
})

或者你可以用布尔块

<template name="errorDisplay">
  {{#if hasError}}
    <div class="alert alert-danger">There is an error!</div>
  {{/if}}
</template>

和你的js

Template.errorDisplay.helpers({
  hasError: function() {
    return error && true;
  }
})

由JQuery insert插入的元素在Meteor中导航后不会消失

1 个答案: