masyarakat

Belajar

Perpustakaan Alatan

Alat AI

Masa lapang

Melayu

Jadual Kandungan

代码示例

Rumah

hujung hadapan web

html tutorial

HTML如何限制input输入框只能输入纯数字

HTML如何限制input输入框只能输入纯数字

Apr 25, 2021 am 09:19 AM

input nombor

本篇文章给大家介绍在HTML中限制input输入框只能输入纯数字的方式。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

onkeyup = &quot;value=value.replace(/[^\d]/g,&#39;&#39;)&quot;

Salin selepas log masuk

使用 onkeyup 事件，有 bug ，那就是在中文输入法状态下，输入汉字之后直接回车，会直接输入字母

onchange = &quot;value=value.replace(/[^\d]/g,&#39;&#39;)&quot;

Salin selepas log masuk

使用 onchange 事件，在输入内容后，只有 input 丧失焦点时才会得到结果，并不能在输入时就做出响应

oninput = &quot;value=value.replace(/[^\d]/g,&#39;&#39;)&quot;

Salin selepas log masuk

使用 oninput 事件，完美的解决了以上两种问题，测试暂时还没有出现其它问题。

代码示例

&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot;&gt;
&lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot; /&gt;
    &lt;title&gt;input&lt;/title&gt;
    &lt;/head&gt;
    
    &lt;body&gt;
    只能输入纯数字的输入框:&lt;input type=&quot;text&quot; name=&quot;&quot; oninput=&quot;value=value.replace(/[^\d]/g,&#39;&#39;)&quot;&gt;
    &lt;/body&gt;
    &lt;/html&gt;

Salin selepas log masuk

推荐学习：html视频教程

Atas ialah kandungan terperinci HTML如何限制input输入框只能输入纯数字. 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

Artikel Panas

Repo: Cara menghidupkan semula rakan sepasukan

3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Berapa lama masa yang diperlukan untuk mengalahkan fiksyen berpecah?

3 minggu yang lalu By DDD

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)

1 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Hello Kitty Island Adventure: Cara mendapatkan biji gergasi

3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Kesukaran mengemas kini caching laman web akaun rasmi: Bagaimana untuk mengelakkan cache lama yang mempengaruhi pengalaman pengguna selepas kemas kini versi?

3 minggu yang lalu By 王林

Tunjukkan Lagi

Alat panas Tag

Kod&IT

Suara

Perniagaan

Pemasaran

Pengesan AI

Chatbot

Reka bentuk&Seni

Artikel Panas

Repo: Cara menghidupkan semula rakan sepasukan

3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Berapa lama masa yang diperlukan untuk mengalahkan fiksyen berpecah?

3 minggu yang lalu By DDD

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)

1 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Hello Kitty Island Adventure: Cara mendapatkan biji gergasi

3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Kesukaran mengemas kini caching laman web akaun rasmi: Bagaimana untuk mengelakkan cache lama yang mempengaruhi pengalaman pengguna selepas kemas kini versi?

3 minggu yang lalu By 王林

Tunjukkan Lagi

Tag artikel 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)

Tunjukkan Lagi

Topik panas

Di manakah pintu masuk log masuk untuk e-mel gmail?

7286

9

Tutorial Java

1622

14

Tutorial CakePHP

1342

46

Tutorial Laravel

1259

25

Tutorial PHP

1206

29

Tunjukkan Lagi

Related knowledge

iOS 17: Cara menukar gaya jam iPhone dalam mod siap sedia

iOS 17: Cara menukar gaya jam iPhone dalam mod siap sedia Sep 10, 2023 pm 09:21 PM

iOS 17: Cara menukar gaya jam iPhone dalam mod siap sedia

Hasilkan nombor rawak dan rentetan dalam JavaScript

Hasilkan nombor rawak dan rentetan dalam JavaScript Sep 02, 2023 am 08:57 AM

Hasilkan nombor rawak dan rentetan dalam JavaScript

Cari nombor yang tidak boleh dibahagikan dengan mana-mana nombor dalam julat, menggunakan C++

Cari nombor yang tidak boleh dibahagikan dengan mana-mana nombor dalam julat, menggunakan C++ Sep 13, 2023 pm 09:21 PM

Cari nombor yang tidak boleh dibahagikan dengan mana-mana nombor dalam julat, menggunakan C++

Program C++ untuk membundarkan nombor kepada n tempat perpuluhan

Program C++ untuk membundarkan nombor kepada n tempat perpuluhan Sep 12, 2023 pm 05:13 PM

Program C++ untuk membundarkan nombor kepada n tempat perpuluhan

Gunakan C++ untuk menulis kod untuk mencari nombor bukan persegi Nth

Gunakan C++ untuk menulis kod untuk mencari nombor bukan persegi Nth Aug 30, 2023 pm 10:41 PM

Gunakan C++ untuk menulis kod untuk mencari nombor bukan persegi Nth

Semak sama ada ia adalah nombor menggunakan fungsi is_numeric() dalam PHP

Semak sama ada ia adalah nombor menggunakan fungsi is_numeric() dalam PHP Jun 27, 2023 pm 05:00 PM

Semak sama ada ia adalah nombor menggunakan fungsi is_numeric() dalam PHP

Nombor dalam Java (dengan 0 awalan dan rentetan)

Nombor dalam Java (dengan 0 awalan dan rentetan) Aug 29, 2023 pm 01:45 PM

Nombor dalam Java (dengan 0 awalan dan rentetan)

Mewakili nombor sebagai jumlah bilangan nombor perdana terbesar yang mungkin dalam C++

Mewakili nombor sebagai jumlah bilangan nombor perdana terbesar yang mungkin dalam C++ Aug 31, 2023 pm 04:29 PM

Mewakili nombor sebagai jumlah bilangan nombor perdana terbesar yang mungkin dalam C++

See all articles