Bagaimana untuk mengehadkan bilangan aksara dalam jquery

Dengan perkembangan pesat Internet, semakin banyak laman web dan aplikasi melibatkan watak atau had perkataan. Contohnya, platform e-dagang perlu mengehadkan panjang nama pengguna; platform Weibo perlu mengehadkan bilangan aksara dalam siaran Weibo; Sebagai tindak balas kepada keperluan ini, JQuery menyediakan beberapa kaedah mudah untuk mengehadkan bilangan aksara atau perkataan dalam kotak input atau kotak teks Artikel ini akan memperkenalkan beberapa kaedah yang biasa digunakan.

1. Kira bilangan aksara atau perkataan dalam kotak input atau kotak teks

Kita boleh menggunakan fungsi val() JQuery untuk mendapatkan nilai dalam kotak input atau teks kotak, dan kemudian gunakan Sifat panjang mendapat panjangnya untuk mengira bilangan aksara atau perkataan. Contohnya adalah seperti berikut:

$("#input").on("input",function(){
    var text = $(this).val();
    var num = text.length;
    $("#count").text(num);
});

Dalam kod ini, kami menggunakan peristiwa input Apabila pengguna memasukkan mana-mana aksara dalam kotak input, peristiwa itu dicetuskan Kemudian kami mendapat nilai kotak input dan digunakan atribut panjang untuk mendapatkan watak, dan akhirnya memaparkan bilangan aksara pada halaman.

2. Hadkan bilangan aksara atau perkataan dalam kotak input atau kotak teks

Selain mengira bilangan aksara atau perkataan, kita juga boleh mengehadkan bilangan aksara atau perkataan dalam kotak input atau kotak teks. Kita boleh menggunakan fungsi val() JQuery untuk memintas sebahagian daripada rentetan untuk mencapai fungsi ini. Contohnya adalah seperti berikut:

$("#input").on("input",function(){
    var text = $(this).val();
    var limit = 10;//定义限制字符数
    if(text.length > limit){//超过限制字符数
        $(this).val(text.substr(0,limit));//截取固定长度的字符串
    }
});

Dalam kod ini, kami mentakrifkan had pembolehubah untuk menentukan bilangan had aksara, dan kemudian menentukan sama ada bilangan aksara melebihi bilangan had aksara dalam acara input ia melebihi, gunakan fungsi substr() Potong rentetan panjang tetap untuk mengehadkan bilangan aksara atau perkataan dalam kotak input atau kotak teks.

3. Paparkan baki aksara atau bilangan perkataan

Kadangkala, pengguna perlu tahu berapa banyak aksara atau perkataan yang boleh mereka masukkan, kita boleh menggunakan JQuery untuk memaparkan aksara yang tinggal Atau bilangan perkataan. Contohnya adalah seperti berikut:

var limit = 10;
$("#input").on("input",function(){
    var text = $(this).val();
    var count = limit - text.length;
    if(count >= 0){
        $("#message").text("您还可以输入 " + count + " 个字符");
    }else{
        $("#message").text("您已超出限制 " + Math.abs(count) + " 个字符");
    }
});

Dalam kod ini, kami mentakrifkan had pembolehubah untuk menentukan bilangan had aksara, dan kemudian dalam acara input, kami mendapat nilai dalam kotak input atau kotak teks dan mengira apa lagi yang boleh dimasukkan Berapa banyak aksara yang ada dengan sewajarnya berdasarkan hasil pengiraan.

Selain daripada tiga kaedah di atas, terdapat kaedah lain untuk mengehadkan bilangan aksara atau perkataan, seperti menggunakan atribut panjang maksimum HTML5, menggunakan pemalam, dsb. Ringkasnya, JQuery menyediakan banyak kaedah mudah untuk mengehadkan bilangan aksara atau perkataan dalam kotak input atau kotak teks Anda boleh memilih kaedah yang sesuai mengikut keperluan sebenar.

Atas ialah kandungan terperinci Bagaimana untuk mengehadkan bilangan aksara dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!