Kirish matnida matn formatini qanday tuzatish kerak?

Men JQuery-dan foydalanmoqchiman va foydalanuvchi kirishni 'mm-dd-yyyy' raqamini kiritish uchun kirishni yaratishni xohlayman.

Misol: foydalanuvchining raqamini 12 (oyning sonini) avtomatik ravishda - ko'rsatmoqchi bo'lganida. Buni iloji bormi?

1
Men veb-ga asoslangan kirish uchun munosib maskalash echimini topmadim. Men duch keladigan har bir kishi biroz kichkina quirkaga ega; va u yerda juda ko'p chiroylik bor. Agar siz maskalanishni ishlatmoqchi bo'lsangiz, mavjud echimdan foydalanish yaxshidir: masalan. digitalbush.com/projects/masked-input-plugin
qo'shib qo'ydi muallif rkw, manba

3 javoblar

$('input').keyup(function(e){
    var val = $(this).val();
    val = val.replace(/[^0-9]/g,'');
    if(val.length >= 2)
        val = val.substring(0,2) + '-' + val.substring(2); 
    if(val.length >= 5)
        val = val.substring(0,5) + '-' + val.substring(5); 
    if(val.length > 10)
        val = val.substring(0,10);
    $(this).val(val);
});

Mana jonli demo:

http://jsfiddle.net/AUAJ3/

Yangilash:

Ba'zi optimizatsiyalar:

  • "maxsus" tugmachalardan biri bosilsa, keydown / keyup voqealarini to'xtatmasligingiz kerak (bu holda o'chirish , orqaga bo'sh joy va strelka tugmalari) joriy qiymatni o'zgartirishga imkon beradi
  • Ko'rsatilgan tugma haqiqiy raqam (0-9) bo'lsa va ni to'xtatsangiz keydown kodini tekshirishingiz kerak
  • Tahrir algoritmini change hodisasiga ham bog'lang.
$('input')  
    .change(function(e){
        $(this).val(formatDate($(this).val()));
    })
    .keyup(function(e){
         if(isSpecialKey(e.keyCode))
            return true;
          $(this).val(formatDate($(this).val()));
    })
    .keydown(function(e){
        if(isSpecialKey(e.keyCode))
            return true;
        var k = e.charCode || e.which;
        var keyVal = String.fromCharCode(k);
        if(!/[0-9]/.test(keyVal) || $(this).val().length > 9)
            {
                e.preventDefault();
                return false;
            }
    });

function formatDate(val){
    val = val.replace(/[^0-9]/g,'');
    if(val.length >= 2)
        val = val.substring(0,2) + '-' + val.substring(2); 
    if(val.length >= 5)
        val = val.substring(0,5) + '-' + val.substring(5); 
    if(val.length > 10)
        val = val.substring(0,10);
    return val;
}

function isSpecialKey(k){
    for(var i in KEY)
        if(KEY[i] == k)
            return true;
    return false;
}

var KEY = {
    'delete' : 46,
    'backspace' : 8,
    'left' : 37,
    'right' : 39,
    'up' : 38,
    'down' : 40
}

Mana jonli demo:

http://jsfiddle.net/AUAJ3/2/

Ikkinchi yangilanish:

Siz o'zingizning kirish maydoningiz talab qilgan sana formatida ma'lumot berishingiz kerak Ushbu yangi xususiyat uchun yangilangan demo ni ko'ring.

5
qo'shib qo'ydi
@ gion_13, mavzu matnning oxirida belgilanadigan muammolar ... agar biror raqamni o'zgartirish kerak bo'lsa, barcha matnni o'chirib, qayta yozing.
qo'shib qo'ydi muallif Dail, manba
@Dali: yangilangan javobni ko'ring
qo'shib qo'ydi muallif gion_13, manba
Muvofiqlashtirish. Bir vaqtning o'zida bir nechta bosimlarni hisobga oladi. ovoz berdi!
qo'shib qo'ydi muallif Marco Johannesen, manba

Buni ko'ring: http://jsfiddle.net/g8KSg/ :)

$('#checkval').keyup( function() {

    var value = $(this).val();

   //check for first 2 chars
    if(value.length === 2) {
        value += "-";
        $(this).val(value);
    }

   //check for first 4 + "-"
    if(value.length === 5) {
        value += "-";
        $(this).val(value);
    }

});
0
qo'shib qo'ydi

Buni tekshiring

$(document).ready( function() {
        $("#mytextbox").attr('maxlength', 10);       
        $('#mytextbox').keyup(function(e){
            var value = $(this).val();
            if(value.length == 2)
            {
                $(this).val(function(index, val) {
                        return val + '-';
                    });
            }
            if(value.length == 5)
            {
                $(this).val(function(index, val) {
                        return val + '-';
                    });
            }

        });
}) ;

Va html

<input type="text" id="mytextbox">

And live demo here

Tahrirlash: Maksimal uzunlikni o'rnatish uchun buni ishlatish

$("#mytextbox").attr('maxlength', 10);

Namoyish

0
qo'shib qo'ydi
Men yozishim mumkin emas: 12-12-222222222222 - abadiy matn. Menga ma'lum uzunlik kerak.
qo'shib qo'ydi muallif Dail, manba
O'zgartirilgan javobimni tekshirib ko'raylik .....
qo'shib qo'ydi muallif Rupesh Pawar, manba