How to leave a message in javascript-Front-end Q&A-php.cn

How to leave a message in javascript

藏色散人

Release： 2022-01-18 14:37:34

Original

3126 people have browsed it

How to implement messages in javascript: 1. Create an HTML sample file and enter the input tag; 2. Enter the script tag; 3. Implement it through the js code "oPostBtn.onclick = function(){...}" Just leave a message.

How to leave a message in javascript

The operating environment of this article: windows7 system, javascript version 1.8.5, Dell G3 computer.

How to leave a message in javascript?

JS native writing to implement the message board function

implementation The function of this message board is relatively simple, so let’s show the renderings first:
How to leave a message in javascript
Realize the content of user messages and the specific time of 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>

Copy after login

Catch the content by getting the input focus event of the input, and pass it to the p of the message board for display.

<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>

Copy after login

Recommended study: "js Basic Tutorial"

The above is the detailed content of How to leave a message in javascript. For more information, please follow other related articles on the PHP Chinese website!