草庐IT

javascript - Backbone 这种困惑

coder 2025-03-10 原文

我有以下代码:

var GoalPanelView = Backbone.View.extend({

    // Bind to the goal panel DOM element
    el: $("#sidebar-goals"),    

    // Initialize the collection
    initialize: function() {
        this.collection = Goals;
        this.collection.bind('add', this.appendItem);
    },

    // Create a new goal when a user presses enter in the enter goal input
    createOnEnter: function(e) {
        if (e.keyCode != 13) return;
        this.addItem();
        //Goals.create(this.newAttributes());           
    },

    // Add the goal item to the goal list
    addItem: function() {
        var goal = new Goal();
        goal.set(this.newAttributes());
        var goalsElem = this.el;
        this.collection.add(goal);
        $(this.el).children("#enter-goal").val('');
    },

    // Append DOM element to the parent el
    appendItem: function(item) {
        var goalView = new GoalView({
            model: item,
        });
        $(this.elem).append(goalView.render().el);
    }

});

我的问题出在 appendItem 函数内部。当我在 appendItem 函数中使用 this 时，我相信它认为 this 指的是 this.collection 而不是 GoalPanelView。我如何让 this 引用 GoalPanelView 而不是 collection？我试图将另一个变量传递给保存 this.elem 内容的 appendItem 函数，但它似乎不起作用。

当我将 appendItem 函数移动到 collection 并将初始化更改为绑定(bind)到 this.collection.bind('add' , appendItem); 但我不想将 view 内容放入 collection 逻辑中。

最佳答案

您可以在绑定(bind)事件处理程序时添加范围，如下所示:

this.collection.bind('add', this.appendItem, this);

范围在处理程序中设置 this 的值。在你的例子中，当前对象。

编辑: Javascript Garden很好的解释了为什么this.appendItem实际上并没有承载函数本身的作用域，它只是一个函数指针，而不是方法指针。 Javascript 的怪癖之一..

编辑2 Backbone Reference - Events / on

关于javascript - Backbone 这种困惑，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9881560/

javascript困惑codethiscollectionbackbone.js

有关javascript - Backbone 这种困惑的更多相关文章

  1. ruby-on-rails - 在这种情况下我如何模拟一个对象？没有明显的方法可以用模拟替换对象 - 2

    假设我在Store的模型中有这个非常简单的方法:defgeocode_addressloc=Store.geocode(address)self.lat=loc.latself.lng=loc.lngend如果我想编写一些不受地理编码服务影响的测试脚本，这些脚本可能已关闭、有限制或取决于我的互联网连接，我该如何模拟地理编码服务？如果我可以将地理编码对象传递到该方法中，那将很容易，但我不知道在这种情况下该怎么做。谢谢!特里斯坦 最佳答案 使用内置模拟和stub的rspecs，你可以做这样的事情:setupdo@subject=MyCl

  2. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  3. ruby - 为什么 Minitest 的 assert_raises 在这种情况下没有按预期工作？ - 2

    我正在尝试使用ActionControllerbugreporttemplate解决Rails中的一个奇怪行为.为了记录，这是模板中的Controller:classTestController我已经为缺失的Action添加了一条路线:routes.drawdoget'/'=>'test#index'get'/missing'=>'test#missing'end并且我试图断言AbstractController::ActionNotFound在遵循该路线时被引发:classBugTest预期行为:绿色测试。实际行为:#Runningtests:D,[2014-04-24T09:17:

  4. ruby-on-rails - 我可以用鸭子类型(duck typing)改进这种方法吗？ - 2

    希望我没有误解“ducktyping”的含义，但从我读到的内容来看，这意味着我应该根据对象如何响应方法而不是它是什么类型/类来编写代码。代码如下:defconvert_hash(hash)ifhash.keys.all?{|k|k.is_a?(Integer)}returnhashelsifhash.keys.all?{|k|k.is_a?(Property)}new_hash={}hash.each_pair{|k,v|new_hash[k.id]=v}returnnew_hashelseraise"CustomattributekeysshouldbeID'sorPropertyo

  5. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  6. ruby - 对回文产品问题感到困惑 - 2

    我一直在学习Ruby，所以我想我应该尝试一下项目中的一些Euler难题。尴尬的是，我只完成了问题4...问题4如下:Apalindromicnumberreadsthesamebothways.Thelargestpalindromemadefromtheproductoftwo2-digitnumbersis9009=91×99.Findthelargestpalindromemadefromtheproductoftwo3-digitnumbers.所以我想我会在嵌套的for循环中从999循环到100并测试回文，然后在找到第一个(应该是最大的)时跳出循环:final=nilrang

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  9. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

  10. Ruby enum_for 困惑 - 2

    我正在尝试查找名为Command的特定类型的所有子类在Ruby中，我遇到了以下代码，它完美地完成了这个技巧，但是我真的不明白它是如何工作的，主要是class部分。我已经尝试阅读此内容，但我觉得我仍然缺少一些Ruby魔法。有人可以向我解释一下吗:-)ObjectSpace.enum_for(:each_object,class 最佳答案 class返回Command的单例类.这是Command的唯一(直接)实例的类。在ruby​​中，C的子类的单例类是C的单例类的子类。所以Command的所有子类都有继承自Command的单例类的单例

随机推荐