Javascript Backbone.js：访问通过Ajax提供服务的HTML片段中返回的JSON？

我正在构建一个web应用程序，后端使用Django，前端使用主干

当用户执行搜索（或为现有搜索加载更多结果）时，我使用Django提供的部分模板通过Ajax检索结果

这很好，但是我还想更新搜索过滤器，这样用户就不能优化结果为零的查询集

例如：如果用户搜索1000美元到3000美元之间的汽车，但没有蓝色汽车可用，我想在搜索表单中将“蓝色”颜色选择器灰显。因此，除了返回结果外，我还返回一个带有可用颜色的JSON对象

我的问题是：我知道如何将结果注入页面的HTML元素，并且知道如何在模板片段中返回JSON但如何从主干网内部访问JSON？

这是我的主干模型。它在执行Ajax请求时侦听搜索事件，并将其“results”属性设置为Ajax返回的模板片段：

var SearchModel = Backbone.Model.extend({  ..
  performSearch: function() {
  $.get(this.get("querystr"), function(html) {
    self.set("results", html);
    // TODO: How to extract JSON results
  });
  } ...
 });

Django通过Ajax返回的模板片段包含HTML和JSON：

<script type="text/javascript">
  var queryset_propeties = JSON.parse('{{queryset_properties|jsonify|escapejs}}');
</script>
<ul id="results">
{% for results in results %}
<li>{{ result }}</li>
{% endfor %}    
</ul>

我的问题是

queryset\u属性

对象不是最新的，我不知道如何从主干代码内部访问它

我想到了以下几点：

进行两次调用，一次调用HTML文件，一次调用JSON文件。由于额外的HTTP开销，我希望避免这种情况

只通过Ajax返回JSON，并使用它更新主干中的所有HTML，而不是从Django返回模板。不过我想避免这种情况，因为通过返回HTML，Django应用程序可以为非JS用户（比如搜索机器人）工作，这一点很重要

以某种方式从返回的HTML中提取JSON对象，并将其设置为主干模型属性，然后我可以用通常的方式使用它——但是除了使用正则表达式或其他同样混乱的东西外，如何做到这一点呢

有什么想法吗

我的问题是：我知道如何将结果注入HTML 元素，我知道如何在模板中返回JSON 碎片。但是如何从主干网内部访问JSON呢

不要让那些

$.get

请求使用主干网。它具有适当的成功和错误回调，就像jQuery的

$.get

要以主干方式进行，首先必须设置：

初始化模型调用

fetch

后：

var sm = new SearchModel({querystr: "http://example.com?car"});
sm.fetch({ // calls model's url
    success: function (model) {
        // you can access the returned json object here by doing:
        model.get('price'); // assuming your json looks like { price: 500 }
    },
    error: function (model) {
    }
 });

---

谢谢

fetch

听起来不错，但我不确定这是否适合我，因为我需要在同一个请求中同时返回HTML和JSON。或者我可以返回一个JSON对象，其中一个值是HTML字符串。。。？

var SearchModel = Backbone.Model.extend({
    url: this.get("querystr")
});

var sm = new SearchModel({querystr: "http://example.com?car"});
sm.fetch({ // calls model's url
    success: function (model) {
        // you can access the returned json object here by doing:
        model.get('price'); // assuming your json looks like { price: 500 }
    },
    error: function (model) {
    }
 });