2015-11-09 2 views
0

Я использую Jquery Numeric box на одной из моих страниц. Я должен принимать числовой ввод от пользователя, у которого есть его минимальное и максимальное значение. Проблема в том, что я устанавливаю минимальное значение и пытаюсь ввести значение с помощью клавиатуры, оно автоматически отображает минимальное значение, не позволяя мне вводить полное значение.JSFiddle не позволяет установить значение ввода

Например, в демо: Demo Link Here

max = $this.spinner('option', 'max'), 
min = $this.spinner('option', 'min'); 

Min установлен на 100 и Макс устанавливается на 1000, но если я хочу, чтобы ввести 500 с клавиатуры, когда я нажимаю 5, он автоматически устанавливает его значение 100.

У кого-то такая же проблема?

+1

Вы можете дать ссылку на скрипке – Kais

+0

Были редактирование вопрос, u быстро просил ссылку ...;) – sk3145

+1

Это потому что keydown реагирует на нажатие клавиши. Итак, он видит 5 как keydown и думает: «Эй, минимум 100, и вы вводите 5!». Вместо этого вы можете использовать «размытие», но это означает, что вам нужно сначала сфокусироваться на поле ввода, прежде чем оно будет обновлено. ** Редактирование: ** По-видимому, вы используете ввод, а в основном, каждая нажатая клавиша («вход») считается нажатием клавиши, поэтому используйте размытие, чтобы он ждал, когда пользователь потеряет фокус ввода. –

ответ

1

Я бы изменил .on('input'...) в вашем коде на .on('blur'...) и изменил значение только после того, как я знаю, что пользователь «закончен» вводит свой ввод, а не раньше, как в вашем примере.

+0

Это может быть один хороший подход .. thanx ... – sk3145

+1

Но что, если у меня нет функции .on ('blur' ...). В другом я имею только $ ('# spinner_example'). Spinner ({ мин: 100, max: 1000, step: 1 }); – sk3145

+1

Так что просто рекламируйте эту часть .on ('blur', function() ...). метод .spinner() может быть привязан к любому другому методу jQuery. –

3

Я сделал некоторые изменения в вашем коде попробовать это plunker:

HTML:

<input type="text" value="0" > 

JS:

$("input").spinner({ 
    max: 1000, 
    min: 100 
}).on('blur', function() { 
    if ($(this).data('onInputPrevented')) return; 
    var val = this.value, 

     $this = $(this), 
     max = $this.spinner('option', 'max'), 
     min = $this.spinner('option', 'min'); 

     // only allow numbers 
     $(this).val($(this).val().replace(/[^0-9]/g, '')); 

    // check input value 
     if(val< 100){ 
      console.log(val.toString().length) 
      if(val.toString().length == 1) 
      $("input").val(val + 0 + 0); 
      if(val.toString().length == 2) 
       $("input").val(val + 0); 


     } 

}); 
+0

Не совсем то, что я хотел, но палец вверх для вашей поддержки ... :) – sk3145

Смежные вопросы