javascript - 通过 JSON/AJAX 更新 HTML

标签 javascript jquery ruby-on-rails ajax json

自从听说 JSON 以来,我一直在我的 Rails 应用程序中使用 JSON 来处理 AJAX 功能,因为使用 RJS/呈现 HTML “感觉”是错误的,因为它违反了 MVC。我从事的第一个 AJAX 密集型项目最终有 20-30 个 Controller 操作直接绑定(bind)到特定的 UI 行为,我的 View 代码分布在 Controller 操作、部分和 rjs 文件上。使用 JSON 允许您在 View 中保留特定于 View 的代码,并且仅通过 AJAX 与 View 不可知/RESTful Controller 操作对话以获取所需数据。

我在使用纯 JSON 时发现的一个令人头疼的问题是您必须通过 JS“呈现”HTML,对于必须更新 DOM-heavy 元素的 AJAX 来说,这可能是一个真正的痛苦。我最终得到了像

这样的长字符串构建代码
// ...ajax 
success: function(records){
  $(records).each(function(record){
    var html = ('<div id="blah">' + record.attr +
      etc +
    ')
  })
}

其中etc是10-15行根据记录数据动态构建HTML。除了烦人之外,这种方法的一个更严重的缺陷是 HTML 结构的重复(在模板和 JS 中)。*对于这种方法有更好的实践吗?

(我最终伸出援手的动机是我现在的任务是更新 HTML 如此复杂以至于首先需要两个嵌套的 Ruby 代码循环来呈现。在 Javascript 中复制它似乎很疯狂。)

  • 我考虑过的一件事是直接从文件系统加载静态部分文件,但这似乎有点过分。

最佳答案

我喜欢模板化的想法。根据我的经验,它确实可以清理那些困惑的字符串操作!

有很多解决方案,例如,查看 John Resig(jQuery 的创建者):

http://ejohn.org/blog/javascript-micro-templating/

关于javascript - 通过 JSON/AJAX 更新 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2088558/

相关文章:

javascript - 使用 javascript 迭代 json 数据的通用函数?

jQuery 从非表单元素序列化/serializeArray

javascript - 跟踪 javascript 内存使用情况

javascript - 如何检查每年的日期是否已达到或过期

ruby-on-rails - Rails 自定义验证有错误但仍然保存?

javascript - 运行函数更改变量时返回 NaN

javascript - 如何在更改 ngPattern 使用的正则表达式时立即重新验证

javascript - 如何用 JavaScript 制作计时器?

ruby-on-rails - Ruby 多重哈希总结

Rails 迁移的 C# 替代方案