Maison > Article > interface Web > js implémente la barre de formulaire pour afficher les compétences code_javascript de l'effet d'horloge au format complet

js implémente la barre de formulaire pour afficher les compétences code_javascript de l'effet d'horloge au format complet

WBOYoriginal: 2016-05-16 15:44:271351parcourir

L'exemple de cet article décrit le code d'implémentation js pour afficher l'effet d'horloge au format complet dans la barre de formulaire. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :

L'horloge à effets spéciaux de la barre de formulaire présentée ici affiche l'effet de l'heure et de la date au format date complète. Elle peut afficher le jour de la semaine et le jour du mois. Dans le passé, elle était affichée directement sur la page Web. mais ce code affiche l'heure dans le texte de la case, regardez le code et vous comprendrez.

La capture d'écran de l'effet en cours d'exécution est la suivante :

L'adresse de la démo en ligne est la suivante :

http://demo.jb51.net/js/2015/js-form-input-showtime-codes/

Le code spécifique est le suivant :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Form栏特全时钟</TITLE>
</HEAD>
<body bgcolor="#ffffff" onLoad="startclock()">
<script language="JavaScript">
<!-- Hide
 var timerID = null
 var timerRunning = false
 function MakeArray(size) 
 {
 this.length = size;
 for(var i = 1; i <= size; i++)
 {
 this[i] = "";
 }
 return this;
 }
 function stopclock (){
 if(timerRunning)
 clearTimeout(timerID);
 timerRunning = false
 }
 function showtime () {
 var now = new Date();
 var year = now.getFullYear();
 var month = now.getMonth() + 1;
 var date = now.getDate();
 var hours = now.getHours();
 var minutes = now.getMinutes();
 var seconds = now.getSeconds();
 var day = now.getDay();
 Day = new MakeArray(7);
 Day[0]="星期天";
 Day[1]="星期一";
 Day[2]="星期二";
 Day[3]="星期三";
 Day[4]="星期四";
 Day[5]="星期五";
 Day[6]="星期六";
 var timeValue = "";
 timeValue += year + "年";
 timeValue += ((month < 10) &#63; "0" : "") + month + "月";
 timeValue += date + "日 ";
 timeValue += (Day[day]) + " ";
 timeValue += ((hours <= 12) &#63; hours : hours - 12);
 timeValue += ((minutes < 10) &#63; ":0" : ":") + minutes;
 timeValue += ((seconds < 10) &#63; ":0" : ":") + seconds;
 timeValue += (hours < 12) &#63; "上午" : "下午";
 document.jsfrm.face.value = timeValue;
 timerID = setTimeout("showtime()",1000);
 timerRunning = true
 }
 function startclock () {
 stopclock();
 showtime()
 }
 //-->
</script>
<form name='jsfrm'>
<input type=text name='face' size=34 value=''>
</form>
</BODY>
</HTML>

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：js implémentation du bouton radio de style interface iPhone et du bouton de case à cocher examples_javascript skillsArticle suivant：js implémentation du bouton radio de style interface iPhone et du bouton de case à cocher examples_javascript skills

Articles Liés

Voir plus