一起使用backbone和jQuery并通过jQuery访问数据值

时间:2021-08-02 20:01:57

I know this is not how you are supposed to do this but we have a legacy jQuery app and there has been some discussion of moving it to backbone. One idiom that would be appealing is something like this:

我知道这不是你应该怎么做的,但是我们有一个遗留的jQuery应用程序,并且已经有一些讨论将它转移到主干上。一个有吸引力的习语是这样的:

<script type="text/html" id="mi_form_template">
  the data-item-id is the value we are interested in!!!
 <button id="item" data-item-id='23'>here is item</button>
  </script>

I know that you are not supposed to store information like this in the DOM with backbone. But want to be able to anticipate the discussion about this.

我知道你不应该在带骨干的DOM中存储这样的信息。但希望能够预见到对此的讨论。

Could I acces the item-id like this?

我可以像这样访问item-id吗?

ItemsRouter = Backbone.Router.extend({
    routes: {
      "new": "newProduct",
      "": "index"
    },
    newProduct: function() {
      alert('here is newProduct');
      var item_id=$(this).data('item-id'); // <- can we do this???
      new ItemFormView( {model: new Item()});
    },
    ind ...

From preliminary tests, this won't work - it looks like the reference to this isn't working. Is this or something like this possible?

从初步测试来看,这不起作用 - 看起来对此的引用不起作用。这样或类似的东西可能吗?

thx in advance

提前thx

1 个解决方案

#1


1  

Normally you'd access data attributes through a view (not a router) with something like this:

通常,您通过视图(而不是路由器)访问数据属性,如下所示:

events: {
    'click #item': 'newProduct'
},
newProduct: function(ev) {
    var item_id = $(ev.target).data('item-id');
    // And now do whatever makes sense, possibly even trigger
    // a route that contains `item_id`.
}

A route handler doesn't know what triggered it, it just knows that it is supposed to handle a particular URL pattern. If you wanted to use a router for this sort of thing then you'd want a link:

路由处理程序不知道触发它的是什么,它只知道它应该处理特定的URL模式。如果您想使用路由器进行此类操作,那么您需要一个链接:

<a href="/new/23">...</a>

and then in the router:

然后在路由器中:

routes: {
    'new/:item_id': 'newProduct'
},
newProduct: function(item_id) {
    // Do things with item_id
}

So you can still use data attributes (which is okay with Backbone BTW) but you'd probably be accessing them in a view's event handlers rather than in a router.

因此,您仍然可以使用数据属性(Backbone BTW可以使用),但您可能在视图的事件处理程序中而不是在路由器中访问它们。

#1


1  

Normally you'd access data attributes through a view (not a router) with something like this:

通常,您通过视图(而不是路由器)访问数据属性,如下所示:

events: {
    'click #item': 'newProduct'
},
newProduct: function(ev) {
    var item_id = $(ev.target).data('item-id');
    // And now do whatever makes sense, possibly even trigger
    // a route that contains `item_id`.
}

A route handler doesn't know what triggered it, it just knows that it is supposed to handle a particular URL pattern. If you wanted to use a router for this sort of thing then you'd want a link:

路由处理程序不知道触发它的是什么,它只知道它应该处理特定的URL模式。如果您想使用路由器进行此类操作,那么您需要一个链接:

<a href="/new/23">...</a>

and then in the router:

然后在路由器中:

routes: {
    'new/:item_id': 'newProduct'
},
newProduct: function(item_id) {
    // Do things with item_id
}

So you can still use data attributes (which is okay with Backbone BTW) but you'd probably be accessing them in a view's event handlers rather than in a router.

因此,您仍然可以使用数据属性(Backbone BTW可以使用),但您可能在视图的事件处理程序中而不是在路由器中访问它们。