jquery серийный формат

Question

У меня есть веб-сайт, предлагающий пользователям вводить серийный номер для продукта.

У меня есть одно текстовое поле и пользователь должен ввести серийный в следующем формате:

xx:xx:xx:xx:xx:xx 

Есть ли какой-либо компонент, который вступит в : после каждых двух персонажей?

Или, может быть, я должен разделить текстовое поле на 6 текстовых полей?

Альтернативно, есть ли какие-либо другие методы, которые вы можете предложить?

Answer 1

Вы можете попробовать this jquery plugin, это эффективно маскированный блок редактирования, вы должны иметь возможность установить свой шаблон и согласовать вход с ним, я настоятельно рекомендую вам ознакомиться с вкладкой демо.

код кажется очень прост в реализации, ваш будет:

jQuery(function($){ 
    $("#serial").mask("99:99:99:99:99:99",{placeholder:"_"}); 
}); 

Конечно, если ваш последовательный требует буквенно-цифровой вход, используйте * вместо 9.

http://digitalbush.com/projects/masked-input-plugin/#demo

В качестве альтернативы вы можете использовать 6 полей ввода, я видел это сделано раньше, и это может выглядеть очень хорошо, я думаю, что это зависит от личных предпочтений.

Answer 2

Вы можете использовать любой маску-плагин для jQuery. Maybe this?

Answer 3

Если вы обнаружите, что плагин будет накладным, что-то вроде этого было бы очень просто создать в jQuery.

я издевался до реализации, которая проверяет, является ли значение (избавление от двоеточия) делится на 2, и в случае, если она есть, она добавляет двоеточие значения:

$(document).ready(function() { 

    $('#serial').keyup(function() { 
    var $this = $(this); 
    if($this.val().replace(/:/g, '').length % 2 == 0) { 
     if($this.val().length >= 17) return; 
     $this.val($this.val() + ':'); 
    } 
    }); 

});​ 

Working example