在ItemView Marionette.js中使用jquery获取ui元素的正确方法

Question

我正在学习Marionette.js，并想知道使用jQuery操作ui元素的正确方法。 在我的LoginItemView中，我声明了ui元素和一个显示无效登录错误消息的函数：

ui: {
  username: "#username",
  password: "#password",
  btnLogin: "#btnDoLogin",
  messageContainer: "#messageContainer"
},
displayMessage: function() {
  // show error message
  $(this.ui.messageContainer.selector).show();
},

我也尝试过：

  $(this.ui.messageContainer[0]).show();

但邮件永远不会显示。
这是模板中的containerMessage代码。

<div class="alert alert-danger alert-dismissable login-message-display" id="#messageContainer" style="display: none;">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <strong>Error!</strong> Username and/or password incorrect!
</div>

Answer 1

无需在ui元素上添加selector 。 ui是一个将选择器映射到键的简单对象。

只是用

$(this.ui.messageContainer).show();

Answer 2

首先要确保在渲染视图后使用DOM元素进行操作。

二-确保displayMessage是caled适当情况下，我在视图instanse链接这个意思。

第三 - 使用@Billy Chan提供的语法来操作节点。

如果您需要进一步的帮助 - 请为测试创建小提琴。

Answer 3

将ui元素用作jquery对象非常简单

Use this.ui.messageContainer.show()

this.ui.messageContainer本身将返回jquery对象。