masyarakat Belajar Perpustakaan Alatan Masa lapang

Melayu

Rumah > hujung hadapan web > tutorial js > javascript写的一个表单动态输入提示的代码_表单特效

javascript写的一个表单动态输入提示的代码_表单特效

WBOY

Lepaskan： 2016-05-16 19:09:38

asal

959 orang telah melayarinya

<title></title> 
  <style type="text/css"> 
  *{ 
  margin:0px;padding:0px;font-size:12px; 
  } 
    input{ 
      width:100px;height:20px;border:1px solid #ccc; 
    }

</style>

<script language="javascript"> 
function tips(id,str){ 
var l=document.getElementById(id).offsetLeft+120; 
var t=document.getElementById(id).offsetTop; 
document.getElementById("tips").innerHTML="提示："+str; 
document.getElementById("tips").style.left=l+"px"; 
document.getElementById("tips").style.top=t+"px"; 
document.getElementById("tips").style.display=""; 
} 
function outtips(){ 
    document.getElementById("tips").style.display='none'; 
} 
</script> 
<div id="tips" style="position:absolute;border:1px solid #ccc;padding:0px 3px;color:#f00;display:none;height:20px;line-height:20px;background:#fcfcfc"></div>

姓名：<input type="text" id="username" onfocus="tips('username','姓名长度最多16个字符')" onblur="outtips()">

密码：<input type="password" id="password" onfocus="tips('password','密码长度必须在3-18位之间')" onblur="outtips()">

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

比较简单，自己闲着无聊写的，很久没有写过代码了。。。。

Label berkaitan：

javascript写的一个表单动态输入提示的代码

sumber：php.cn

Artikel sebelumnya：javascript动画效果类封装代码_javascript技巧 Artikel seterusnya：用js实现的一个根据内容自动生成表格的函数_javascript技巧

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 terbaru oleh pengarang

Apakah itu NullPointerException, dan bagaimana saya membetulkannya?

2024-10-22 09:46:29
Daripada Novis kepada Coder: Perjalanan Anda Bermula dengan Asas C

2024-10-13 13:53:41
Membuka Kunci Pembangunan Web dengan PHP: Panduan Pemula

2024-10-12 12:15:51
Demystifying C: Laluan Yang Jelas dan Mudah untuk Pengaturcara Baharu

2024-10-11 22:47:31
Buka Potensi Pengekodan Anda: Pengaturcaraan C untuk Pemula Mutlak

2024-10-11 19:36:51
Lepaskan Pengaturcara Dalaman Anda: C untuk Pemula Mutlak

2024-10-11 15:50:41
Automasi Kehidupan Anda dengan C: Skrip dan Alat untuk Pemula

2024-10-11 15:07:41
PHP Dipermudahkan: Langkah Pertama Anda dalam Pembangunan Web

2024-10-11 14:21:21
Bina Apa sahaja dengan Python: Panduan Pemula untuk Melancarkan Kreativiti Anda

2024-10-11 12:59:11
Kunci Pengekodan: Membuka Kunci Kuasa Python untuk Pemula

2024-10-11 12:17:31

Isu terkini

Keliru semasa menghantar data imej binari (jpg) ke bahagian belakang AWS Lambda melalui Gerbang API AWS Mohon maaf terlebih dahulu jika saya terlepas sesuatu yang mudah! Saya telah berjaya mengh...

daripada 2024-04-05 13:09:55

0

1

389

Tambahkan nilai tambahan pada medan data format yang dipaparkan menggunakan javascript Saya cuba mencapai ini: Saya ingin mencipta borang yang mengumpul data yang dimasukkan ole...

daripada 2024-04-04 15:17:13

0

1

3589

Limpahan kandungan dalam tetingkap menghalang penatalan dan menyembunyikan kandungan baharu Saya sedang membina program sistem rolet (ini lebih untuk menghalang saya daripada meletak...

daripada 2024-04-03 21:24:55

0

1

285

Bagaimanakah saya boleh mencipta acara jQuery yang memaparkan borang pada klik dua kali, tetapi tidak mencetuskan acara klik dua kali borang? Saya ingin menulis acara yang apabila pengguna mengklik dua kali pada sel jadual, sel itu ...

daripada 2024-04-01 13:42:52

0

2

445

Potong dan kira nombor mudah alih dalam medan textarea borang php Saya mempunyai medan textarea dalam borang saya di mana saya boleh menyalin dan menampal n...

daripada 2024-03-31 08:46:11

0

1

314

Topik-topik yang berkaitan

Lagi>

Cadangan popular

Tutorial Popular

Lagi>

Tutorial berkaitan

Cadangan popular

Kursus terkini

Muat turun terkini

Lagi>

kesan web

Kod sumber laman web

Bahan laman web

Templat hujung hadapan