Rumah > hujung hadapan web > tutorial js > Kaedah JS untuk log masuk dengan menekan kemahiran Enter key_javascript

Kaedah JS untuk log masuk dengan menekan kemahiran Enter key_javascript

WBOY
Lepaskan: 2016-05-16 16:38:43
asal
1492 orang telah melayarinya

Contoh dalam artikel ini menerangkan kaedah JS untuk menekan kekunci Enter untuk log masuk. Fungsi ini mempunyai julat nilai praktikal yang sangat luas. Kongsikan dengan semua orang untuk rujukan anda. Kaedah khusus adalah seperti berikut:

Kaedah 1:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

<title>Check Score</title>

<script language="JavaScript">

function keyLogin(){

 if (event.keyCode==13)  //回车键的键值为13

   document.getElementByIdx_x("input1").click(); //调用登录按钮的登录事件

}

</script>

</head>

<body onkeydown="keyLogin();">

<input id="input1" value="登录" type="button" onClick="alert('调用成功!')">

</body>

</html>

Salin selepas log masuk

Kaedah 2:

1

2

3

4

5

6

7

8

9

10

11

<script>

function KeyDown()

{

  if (event.keyCode == 13)

  {

    event.returnValue=false;

    event.cancel = true;

    Form1.btnsubmit.click();

  }

}

</script>

Salin selepas log masuk

Penggunaan:

1

2

3

4

5

<form name="Form1" method="">

用户名:<INPUT TYPE=text SIZE=20 maxlength = 8 onkeydown=KeyDown()>

密码:<INPUT TYPE=password SIZE=20 maxlength = 8 onkeydown=KeyDown()>

<input type="submit" name="btnsubmit" value="提交" />

</form>

Salin selepas log masuk

Kaedah 3:

Mana-mana halaman laman web mempunyai antara muka log masuk Berkali-kali selepas memasukkan nama pengguna dan kata laluan, anda perlu menggunakan tetikus untuk mengklik butang atau pautan yang serupa dengan log masuk Hanya dengan cara ini anda boleh memasuki laman web dan melakukan apa yang anda suka buat
Kadang-kadang saya tertanya-tanya sama ada saya boleh menaip apa yang saya perlu masukkan dan hanya tekan Enter untuk melaksanakan fungsi log masuk Penyelesaiannya adalah seperti berikut:

kod halaman ss.html:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

<html>

<head>

<title></title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<link rel="stylesheet" href="css/text.css" type="text/css">

</head>

<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onkeydown="on_return();">

  <form name ="loginForm" method="post" action="fuck.html">       

   <table width="100%" border="0" cellspacing="0" cellpadding="0">

 <tr>

 <td width="69%" height="30"><span class="font_04">帐户名</span>

  <input type="text" name="userName" size="18.5">

 </td>

    </tr>

    <tr>

 <td width="69%" height="30"><span class="font_04">密 码</span>

  <input type="password" name="pwd" >

 </td>

    </tr>

    <tr>

 <td width="31%" height="30">

 <a id="sub" onClick='check()' >

 登陆</a></td>

    </tr>

   </table>

  </form>

</body>

</html>

<script language="javascript">

function check() {

    var formname=document.loginForm;

   if (formname.userName.value == "") {

    alert("请输入用户名!");

    formname.userName.focus();

    return false;

  }

  if (formname.pwd.value == "") {

    alert("请输入密码!");

    formname.pwd.focus();

    return false;

  }

  formname.submit();

}

  //回车时,默认是登陆

 function on_return(){

 if(window.event.keyCode == 13){

  if (document.all('sub')!=null){

   document.all('sub').click();

   }

 }

 }

</script>

Salin selepas log masuk

Di siniNota: Dalam kami menambah atribut onkeydown, supaya selepas kami memasukkan kandungan, kami boleh terus melaksanakan kaedah JS on_return() dengan menekan kekunci Kerana window.event .keyCode jika Jika ia adalah 13, ia bermakna kekunci Enter, jadi kita menilai sama ada kekunci yang kita tekan adalah kekunci Enter Jika ia, kita akan mencari atribut 'sub' Jika kita jumpa kaedah klik, itu sahaja .

Saya harap kaedah yang diterangkan dalam artikel ini akan membantu reka bentuk pengaturcaraan web semua orang.

Label berkaitan:
sumber:php.cn
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan