Maison > Article > interface Web > Comment laisser un message en javascript

Comment laisser un message en javascript

藏色散人original: 2022-01-18 14:37:343207parcourir

Comment laisser un message en utilisant JavaScript : 1. Créez un exemple de fichier HTML et entrez la balise d'entrée ; 2. Entrez la balise de script ; 3. Utilisez le code js "oPostBtn.onclick = function(){...}" pour laisser un message.

L'environnement d'exploitation de cet article : système Windows 7, version JavaScript 1.8.5, ordinateur Dell G3.

Comment laisser un message en JavaScript ?

Écriture native JS pour implémenter la fonction de babillard électronique

Il est relativement simple d'implémenter cette fonction de babillard électronique, regardons donc d'abord les rendus :
Comment laisser un message en javascript
Réaliser le contenu de l'utilisateur messages et l'heure précise des messages.

<script>

	window.onload = function(){
		
		var oMessageBox = document.getElementById("messageBox");
		var oInput = document.getElementById("myInput");
		var oPostBtn = document.getElementById("doPost");
		
		oPostBtn.onclick = function(){
			if(oInput.value){
				//写入发表留言的时间
				var oTime = document.createElement("p");
				oTime.className = "time";
				var myDate = new  Date();
				oTime.innerHTML = myDate.toLocaleString();
				oMessageBox.appendChild(oTime);
				
				//写入留言内容
				var oMessageContent = document.createElement("p");
				oMessageContent.className = "message_content";
				oMessageContent.innerHTML = oInput.value;
				oInput.value = "";
				oMessageBox.appendChild(oMessageContent);
			}
			
		}
		
	}

</script>

Attrapez le contenu en obtenant l'événement de focus d'entrée de l'entrée et transmettez-le au p du babillard électronique pour l'afficher.

<body>
	<div class="content">
        <div class="title">用户留言</div>
        <div class="message_box" id="messageBox"></div>
        <div><input id="myInput" type="text" placeholder="请输入留言类容"><button id="doPost">提交</button></div>
    </div>
</body>

Apprentissage recommandé : "Tutoriel de base js"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

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：Javascript a-t-il des valeurs nulles ?Article suivant：Javascript a-t-il des valeurs nulles ?

Articles Liés

Voir plus