Question

我在简单的html输入字段时遇到了一些问题，当我尝试用JS进行一些检查时。我正在尝试添加一些类和attribite取决于firt字符，但如果我试图通过箭头按钮移动carrege它不会移动。可能有些人可以帮助我并解释它为什么会发生。

请在下面找到jsfiddle https://jsfiddle.net/4fpfjeed/

我的JS文件

jQuery(document).on('change keydown keyup click', ".js-format-login", function(event){
   var $self = jQuery(this),
       selfVal = $self.val();

   var c = selfVal.replace(/\s/gi, "");

   if(selfVal.indexOf('9643') === 0 || selfVal.indexOf('9642') === 0){
     $self.addClass('js-format-digits js-format-bonuscard').attr({
       'minlength': 19,
       'maxlength': 19,
       'data-min-symbols':"Min length is 16 character"
     });

   } else {
     $self.removeClass('js-format-digits js-format-bonuscard').attr({
       'minlength': 2,
    }).removeAttr('maxlength data-min-symbols').val(c);
   }
  });

Answer 1

更改输入字段的值时，光标将移动到最后。

您可以通过在更改值之前存储位置来防止这种情况，然后在完成后将其更改回来。

jQuery(document).on('change keydown keyup click', ".js-format-login", function(event) {
    var $self = jQuery(this),
        selfVal = $self.val();

    // store the cursor position //
    var start = this.selectionStart,
    var end = this.selectionEnd;
    ///////////////////////////////

    var c = selfVal.replace(/\s/gi, "");


    if (selfVal.indexOf('9643') === 0 || selfVal.indexOf('9642') === 0) {
        $self.addClass('js-format-digits js-format-bonuscard').attr({
            'minlength': 19,
            'maxlength': 19,
            'data-min-symbols': "Длина не менее 16 символов"
        });

    } else {
        $self.removeClass('js-format-digits js-format-bonuscard').attr({
            'minlength': 2,
        }).removeAttr('maxlength data-min-symbols').val(c);
    }

    //  set the position back //    
    this.setSelectionRange(start, end);
    ////////////////////////////

});

输入字段中的运输位置（JavaScript）

1 个答案: