3

我正在使用带有主干视图的 tinymce 编辑器。对于其他表单字段，我将更改事件绑定到一个函数，该函数使模型与表单的更改保持同步：

events: {
        "change input":  "synchModel",
        "change textarea":  "synchModel",
        "change select":  "synchModel"                                              
    }

问题是 tinymce 编辑器有效地替换了它绑定到的底层文本区域，因此在更新编辑器内容时不会触发任何更改事件。为了尝试以与上述类似的方式解决此问题，我将另一个函数绑定到 tinymce 更改事件：

$(el).find('.wysiwyg').tinymce({
            // Location of TinyMCE script
            script_url : 'tiny_mce.js',
            theme : "simple",
            onchange_callback : "synchModelWysiwyg"
        });

我 synchModelWysiwyg 我尝试使用 this 表示法从主干视图访问模型，即使在绑定之后也不成功：

  this.model.set(name, value);

我什至尝试将方法添加到视图中的 bindAll ：

_.bindAll(this, 'render', 'synchModelWysiwyg')

无论如何，似乎因为tinymce正在触发synchModelWysiwyg方法而不是主干，所以“this”并没有像我想要的那样被绑定。

关于如何在 synchModelWysiwyg 方法中处理视图的“this”的任何建议？

我的回退是在保存时收集所有所见即所得的值，但我试图避免这种情况以保持一致。

4

1 回答 1

1

我假设您的代码示例在视图的render方法中。如果是，那么我建议将变量设置为视图的上下文，并在onchange_callback函数中使用该变量。

这是一些示例代码：

// set the view's context to the self variable
var self = this;
$(el).find('.wysiwyg').tinymce({
  // Location of TinyMCE script
  script_url : 'tiny_mce.js',
  theme : "simple",
  onchange_callback : function(args) {
    // self references the view
    self.synchModelWysiwyg(args)
  }
});
于 2012-08-20T13:12:28.360 回答