Как получить значение введенных пользователем данных?

Скажем, у меня есть веб-сайт с некоторыми полями, на которые я хочу выполнить некоторые вычисления. У меня есть количество ввода, а в моем backbone.js View Я привязал событие "change" к этому вводу.

Как получить значение изменений в поле ввода?

Я нашел этот метод (ниже), чтобы получить значение, но он чувствует себя не так, потому что мне снова нужно знать идентификатор элемента в моей функции. Например, я не мог сделать это с помощью класса.

window.Calculations = Backbone.View.extend({

    (...)

    events: {
        'change input#quantity': 'changeQuantity'
    },


    changeQuantity: function() {
        var val = $(this.el).find('input#quantity').val();
        this.model.set({'quantity': val});
    }

});

И в HTML:

<input type="text" id="quantity" value="<%= quantity %>">

Я правильно подошел? Есть ли переменная, которая обращается к объекту, который был изменен? Я знаю, что $(this.el) не так, это просто контейнер.

Ответ 1

jQuery отправляет объект event вашей функции changeQuantity. С его помощью вы можете получить измененный ввод.

window.Calculations = Backbone.View.extend({

    //(...)

    events: {
        'change input#quantity': 'changeQuantity'
    },


    changeQuantity: function(e) {
        var val = $(e.currentTarget).val();
        this.model.set({'quantity': val});
    }

});

В качестве примера я создал jsfiddle: http://jsfiddle.net/tz3XS/138/

Ответ 2

вам нужно использовать target события, которое вы можете получить в качестве аргумента функции обратного вызова. (я должен был добавить код сам, чтобы он работал, поскольку вы не дали нам код модели, я заменил его на window.CalcModel(пустая модель))

window.CalcModel = Backbone.Model.extend({});

window.Calculations = Backbone.View.extend({

    events: {
        'change input#quantity': 'changeQuantity'
    },

    initialize: function() {

    },

    changeQuantity: function(evt) {
        var val = $(evt.target).val();
        this.model.set({'quantity': val});
        $(this.el).find('#result').text('new value = ' + val);
    },

    render: function() {

    }

});

var c = new window.Calculations({model: new CalcModel(), el: '#myView'});

Пример http://jsfiddle.net/saelfaer/uxHLL/