Question

结构概念： -
基本上，我正在尝试创建包含输入的模态窗口，并且当索引页面上的输入聚焦时，模式窗口当前触发，我已经使用数据属性通过为它们分配相同的属性值来建立它们之间的链接。

Javascript概念： -
对于模态窗口，我创建了模态对象。和model对象包含一个bindModal方法，该方法接受一个参数，该参数是数据属性值。获取该值后，bindModal方法将搜索包含该特定值的dom元素，并在搜索之后，使用每个循环迭代它们。

问题所以基本上我想要每当用户开始在模型输入上输入时，它应该自动写入索引页面的输入中。

如果大家帮助我让我的代码更加优化和结构良好，我将非常感谢大家，最重要的是让我知道我在整体工作中犯了什么错误谢谢

JavaScript代码

   var modal = function () {
    this.toggleModal = function () {
        $('#modal').toggleClass('content--inActive').promise().done(function () {
            $('#modal__close').on('click',function(){
                $('#modal').addClass('content--inActive');
            });
        });
    }
    this.bindModal = function (bindVal) {
        var bindValue = $(document).find('[data-modal-bind = ' + bindVal + ']');
        $.each(bindValue, function (index) {
            var bind1 = $(this);
            if(index === 1) {
                var bind2 = $(this);
                $(bind1).change(function (){
                    $(bind2).val(bind1.val());
                });
            }
        });

    }
}

var open = new modal();

$('#input_search').on('click',function(){
    open.toggleModal();
    open.bindModal('input');
});

Answer 1

这是一种做你想做的事情的方法：

var modal = function() {
  this.bindModal = function(bindVal) {
    var bindValue = $('[data-modal-bind = ' + bindVal + ']');
    bindValue.each(function(index) {
      $(this).keyup(function() {
        var value = $(this).val();

        bindValue.each(function(i, e) {
          $(this).val(value);
        });
      });
    });

  }
}

$('#input_search').on('click', function() {
  var open = new modal();
  open.bindModal('input');
});

已完成的更改：

我在bindValue变量中使用相同的绑定值缓存输入，然后为每个输出绑定keyup事件。在keyup上，当前输入的值是value，然后使用内部循环分配给每个输入。

这使得输入在输入时保持同步。希望能解决你的问题。

使用下一个迭代输入值更改第一次迭代输入的值

1 个答案: