Rumah hujung hadapan web tutorial js 如何操作vue input输入校验字母数字组合且长度小于30

如何操作vue input输入校验字母数字组合且长度小于30

May 29, 2018 pm 02:55 PM
input semak masuk

这次给大家带来如何操作vue input输入校验字母数字组合且长度小于30,操作vue input输入校验字母数字组合且长度小于30的注意事项有哪些,下面就是实战案例,一起来看一下。

下面一段代码给大家分享vue input 校验字母数字组合且长度小于30,具体代码如下所示:

<Input v-model="form.glhm" placeholder="请输入关联交易号" style="width:240px" @on-blur="validateJyh(form.glhm)"></Input> 
validateJyh(glhm){//校验关联交易号 
    var reg = /^[A-Za-z0-9]{1,30}$/; 
    if(!reg.test(glhm)){ 
     this.$Message.error("请输入字母或数字组成的交易关联号"); 
     this.form.glhm = &#39;&#39;; 
    } 
   },
Salin selepas log masuk

下面看下在Vue.Js下使用el-input框只能输入数字并限制位数并且限制中文输入以及粘贴

var tr = document.getElementById("Id1"), // 取得ID为Id1的tr对象
 inps = tr.getElementsByTagName(&#39;input&#39;); // 从tr 对象中获取所有input对象
for(var i = 0, len = inps.length; i < len; i++) {
 inps[i].value = &#39;&#39;; // 将每一个input的value置为空
}
document.getElementById("t").getElementsByTagName(&#39;input&#39;)[0].value=&#39;&#39;;
Salin selepas log masuk

输入中文置空的方法

<el-input
@change="checkNo(searchForm.msel.mselTotalConsumTimes)"
type = "text"
onkeypress="return event.keyCode>=48&&event.keyCode<=57"
size="small"
:maxlength="6"
style="width: 120px"
v-model="searchForm.msel.mselTotalConsumTimes"></el-input>
 次
</el-col>
checkNo(value){
let reg = /^[1-9]\d*$/;
if (value) {
if (value >
999999 || new
RegExp(reg).test(value) ==
false) {
setTimeout(() 
=> {
this.searchForm.msel.mselTotalConsumTimes =&#39;&#39;;
   }, 500);
}
}
},
Salin selepas log masuk

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

怎样操作Vue做出高德地图搭建实时公交应用

怎样使用seajs在require书写约定

Atas ialah kandungan terperinci 如何操作vue input输入校验字母数字组合且长度小于30. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Melumpuhkan Panduan Pengalaman Input Win11 Melumpuhkan Panduan Pengalaman Input Win11 Dec 27, 2023 am 11:07 AM

Baru-baru ini, ramai pengguna Win11 menghadapi masalah bahawa kotak dialog pengalaman input sentiasa berkelip dan tidak boleh dimatikan Ini sebenarnya disebabkan oleh perkhidmatan sistem lalai dan komponen Win11 perkhidmatan pengalaman input Selesai, mari kita mencubanya. Cara mematikan pengalaman input dalam win11: Langkah pertama, klik kanan menu mula dan buka "Pengurus Tugasan". mengikut urutan, klik kanan "Tamat Tugas" "Langkah ketiga, buka menu mula, cari dan buka "Perkhidmatan" di bahagian atas. Langkah keempat, cari "Textinp" di dalamnya

Input Windows menemui hang atau penggunaan memori yang tinggi [Betulkan] Input Windows menemui hang atau penggunaan memori yang tinggi [Betulkan] Feb 19, 2024 pm 10:48 PM

Pengalaman input Windows ialah perkhidmatan sistem utama yang bertanggungjawab untuk memproses input pengguna daripada pelbagai peranti antara muka manusia. Ia bermula secara automatik pada permulaan sistem dan berjalan di latar belakang. Walau bagaimanapun, kadangkala perkhidmatan ini mungkin secara automatik menggantung atau menduduki terlalu banyak memori, mengakibatkan prestasi sistem berkurangan. Oleh itu, adalah penting untuk memantau dan mengurus proses ini tepat pada masanya untuk memastikan kecekapan dan kestabilan sistem. Dalam artikel ini, kami akan berkongsi cara untuk membetulkan isu di mana pengalaman input Windows tergantung atau menyebabkan penggunaan memori yang tinggi. Perkhidmatan Pengalaman Input Windows tidak mempunyai antara muka pengguna, tetapi ia berkait rapat dengan pengendalian tugas dan fungsi sistem asas yang berkaitan dengan peranti input. Peranannya adalah untuk membantu sistem Windows memahami setiap input yang dimasukkan oleh pengguna.

Bagaimana untuk merangkum komponen input dan data borang bersatu dalam vue3 Bagaimana untuk merangkum komponen input dan data borang bersatu dalam vue3 May 12, 2023 pm 03:58 PM

Penyediaan Gunakan vuecreateexample untuk mencipta projek Parameternya adalah seperti berikut: gunakan input asli terutamanya nilai dan perubahan. App.tsx adalah seperti berikut: import{ref}from'vue';exportdefault{setup(){//username is the data constusername=ref('Zhang San');//Apabila kotak input berubah, segerakkan data constonInput =;kembali( )=>({

Bagaimana untuk melaksanakan medan tersembunyi input laravel Bagaimana untuk melaksanakan medan tersembunyi input laravel Dec 12, 2022 am 10:07 AM

Cara melaksanakan medan tersembunyi input laravel: 1. Cari dan buka fail templat Blade 2. Gunakan kaedah method_field dalam templat Blade untuk mencipta medan tersembunyi Sintaks penciptaan ialah "{{ method_field('DELETE') }} ".

Apa yang perlu dilakukan jika tiada kursor apabila mengklik pada kotak input Apa yang perlu dilakukan jika tiada kursor apabila mengklik pada kotak input Nov 24, 2023 am 09:44 AM

Penyelesaian untuk mengklik kotak input tanpa kursor: 1. Sahkan fokus kotak input 2. Kosongkan cache penyemak imbas 4. Gunakan JavaScript 5. Semak input; sifat kotak; 7. Menyahpepijat kod JavaScript; 8. Semak elemen lain halaman;

Selesaikan masalah input bar carian win11 Selesaikan masalah input bar carian win11 Dec 26, 2023 pm 12:07 PM

Bar carian ialah fungsi yang sangat berguna dalam sistem win11, yang boleh membantu kami mencari tetapan, fungsi dan perkhidmatan yang kami inginkan. Walau bagaimanapun, beberapa rakan telah menghadapi situasi bahawa bar carian win11 tidak boleh dimasukkan Kami boleh mengubah suai data yang berkaitan dalam pendaftaran untuk menyelesaikan masalah tersebut. Perkara yang perlu dilakukan jika anda tidak boleh menaip dalam bar carian win11 1. Mula-mula, kita boleh menekan "win+r" pada papan kekunci untuk membuka larian. 2. Kemudian masukkan "regedit" dan tekan Enter untuk membuka Registry Editor. 3. Kemudian masukkan "HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Expl" dalam laluan di atas

Penjelasan terperinci tentang peristiwa mengikat kotak input dalam dokumen Vue Penjelasan terperinci tentang peristiwa mengikat kotak input dalam dokumen Vue Jun 21, 2023 am 08:12 AM

Vue.js ialah rangka kerja JavaScript ringan yang mudah digunakan, cekap dan fleksibel Ia merupakan salah satu rangka kerja bahagian hadapan yang paling popular pada masa ini. Dalam Vue.js, peristiwa mengikat kotak input adalah keperluan yang sangat biasa Artikel ini akan memperkenalkan peristiwa mengikat kotak input dalam dokumen Vue secara terperinci. 1. Konsep asas Dalam Vue.js, peristiwa pengikatan kotak input merujuk kepada pengikatan nilai kotak input kepada objek data bagi contoh Vue, dengan itu mencapai pengikatan dua hala input dan respons. Dalam Vue.j

Cara menggunakan acara pemulangan pengangkutan kotak input dan fungsi pengesahan dalam dokumen Vue Cara menggunakan acara pemulangan pengangkutan kotak input dan fungsi pengesahan dalam dokumen Vue Jun 20, 2023 am 09:13 AM

Vue ialah rangka kerja bahagian hadapan JavaScript yang popular dengan pengikatan data responsif dan sistem komponen pada terasnya. Dalam aplikasi Vue, kotak input ialah salah satu elemen UI yang paling biasa digunakan. Apabila pengguna memasukkan teks, kami berharap untuk mendengar acara pemulangan pengangkutan dan mengesahkan input sebelum menyerahkan. Artikel ini akan memperkenalkan acara masukkan kotak input dan penggunaan fungsi pengesahan dalam dokumen Vue. 1. Acara pemulangan gerabak kotak input dalam Vue Memantau peristiwa pemulangan gerabak kotak input dalam Vue adalah sangat mudah.

See all articles