【问题标题】:Why wouldn't the change event of a input type fire when I'm setting the value of that input type after the view is rendered?当我在视图渲染后设置输入类型的值时,为什么不会触发输入类型的更改事件?
【发布时间】:2019-04-12 07:30:25
【问题描述】:

在主干视图中,我在其事件哈希中添加了输入类型的更改事件,该事件将触发函数并为视图上的某些元素设置值。现在在视图渲染中,我使用下划线 defer 方法为输入类型设置了值,以便在视图附加到 DOM 后设置值。这确实在视图上设置了输入类型的值,但它不会触发它的 changed 事件,这应该设置视图内其他字段的值。

感谢任何帮助!

SomeView = Backbone.View.extend({
    template: 'example.html',
    events: {
        "change #InputElementId": "UpdateFields"
    },
    renderTemplate: function () {
        var view = this,
            model = view.options.selectedModel;

        podiumApp.fetchTemplate(view.template, function (tmpl) {
            view.$el.html(tmpl(model.toJSON()));
        });
    },
    render: function () {
        var view = this,
        view.renderTemplate();
        _.defer(view.loadInputValue);    `enter code here`   

        return view;
    },
    loadInputValue: function () {

            $('#InputElementId').val(model.get('InputRangeValue'));
    },
    UpdateFields: function(){`enter code here`
    // Some logic`enter code here`
      console.log('Changed event fired');
    });

【问题讨论】:

    标签: javascript events backbone.js view render


    【解决方案1】:

    以编程方式设置值不会触发change事件,您必须自己触发它

    this.$('#InputElementId').val(model.get('InputRangeValue')).trigger('change');


      SomeView = Backbone.View.extend({
          template: 'example.html',
          events: {
            'change #InputElementId': 'updateFields'
          },
          initialize: function() {
            this.model = this.options.selectedModel;
          },
          renderTemplate: function() {
            podiumApp.fetchTemplate(this.template, function(tmpl) {
              this.$el.html(tmpl(this.model.toJSON()));
            }.bind(this));
          },
          render: function() {
            this.renderTemplate();
            _.defer(this.loadInputValue.bind(this));
            return this;
          },
          loadInputValue: function() {
            var value = this.model.get('InputRangeValue');
            this.$('#InputElementId').val(value).trigger('change');
          },
          UpdateFields: function() {
            // Some logic
            console.log('Changed event fired');
          });
    

    【讨论】:

      猜你喜欢
      • 2018-09-21
      • 1970-01-01
      • 1970-01-01
      • 2019-08-21
      • 1970-01-01
      • 1970-01-01
      • 2018-07-17
      • 1970-01-01
      • 2018-01-30
      相关资源
      最近更新 更多