Question

我是Backbone的新手。我有一个集合，其url函数取决于文本字段文本。如何从文本字段中获取该文本。不，我不想使用JQuery选择器从您的视图中访问外部选择器，这是一个很好的做法。我的HTML结构就像：

<div id='outer'>
    <input type='text' id='xyz'>
    <div id='image123'></div>
    <div id='div1'>
        <ul>
        </ul>
    </div>
    <div id='div2'></div>
</div>

所以我有2个观看次数，1个集合＆amp; 1个型号。如何在不使用我的＆＃39;外部＆＃39;中的JQuery选择器的情况下获取集合中的输入文本？图。

[使用查看代码更新后发布]

var outerView = Backbone.View.extend
({
    el: '#outer',

    initialize: function()
    {

    },

    events:
    {
        'keyup #xyz' : 'keyfunc'
    },

    keyfunc: function()
    {
        // inputtext is a global variable & i don't want it that way
        inputtext = $('#xyz').val();    
    },

    render: function()
    {

    },
});

Answer 1

我无法确定你在做什么，但只有当你想要将值发送到集合而不是将其设为全局并更改网址时，请尝试这样做

    var outerView = Backbone.View.extend
({
    el: '#outer',

    initialize: function()
    {

    },

    events:
    {
        'keyup #xyz' : 'keyfunc'
    },

    keyfunc: function()
    {
        // not global now
        var inputtext = $('#xyz').val();  
        var myclooction  = new MainCollection({
        text : inputtext
         });

    },

    render: function()
    {

    },
});

集合中的

var MainCollection = Backbone.extend.collection({
    url : function(){
       return "someurl/"+this.text;
    },
    // receive the value here
    initialize:function(options){
     this.text = options.text;
    }
});

Answer 2

Backbone传递有关触发事件的元素的信息，你可以在那里找到这样的值：

keyfunc: function(e)
{
    inputtext = $(e.currentTarget).val();  
    this.model.trigger('textChanged', {id: this.myID, data: inputtext});  
}

并且您的模型可以在其初始化函数中监听此事件。

this.listenTo(this, 'textChanged', this.textChangedHandler);

然后模型可以决定如何处理该事件。例如，通过另一个事件将其发送到另一个视图。

textChangeHandler: function (e) {
    this.trigger('someTextChanged', e);
}

您的观点或集合可以在初始化函数中监听该事件：

this.listenTo(this.model, 'someTextChanged', this.textChangedHandler);

处理程序将类似于：

textChangeHandler: function (e) {
    if (e.id !== this.myID) {
        //do stuff
    }
}

使用输入字段文本的主干集合URL操作

2 个答案: