01/10/2018, 09:36

Function trong Javascript tự động chạy

Hi mọi người,
Mình có một vấn đề thế này, ngay chổ thẻ BUTTON, phải có sự kiện nhấn nút, thì hàm stateUpdate() chạy và xuất dữ liệu ra thẻ H1. Bây giờ mình muốn hỏi là làm cách nào để ngay thẻ H1 luôn hiện dữ liệu lấy từ hàm stateUpdate() mà không cần phải nhấn nút. Mình cảm ơn!

<script type="text/javascript">
 		var HTTPrequest = new XMLHttpRequest();
 		function stateUpdate(){
			HTTPrequest.onreadystatechange = function(){
				if(this.readyState == 4 && this.status == 200){
					document.getElementById("state").innerHTML = this.responseText;
				}
			};
			HTTPrequest.open("GET", "state.asp", true);
			HTTPrequest.send();
</script>
.
.
.
<button type="button" onclick="stateUpdate();">Request data</button>
<h1 id="state"></h1>
.
.
.
nguyen huy hoang viết 11:49 ngày 01/10/2018

tất cả code trong thẻ script sẽ tự động chạy khi trình duyệt load xong, do đó bạn chỉ cần gọi hàm stateUpdate(); trong thẻ script luôn

Lê Nhật Thanh viết 11:41 ngày 01/10/2018

Lúc gọi vậy thì nó mất hết mấy cái thẻ HTML bạn ơi.

nguyen huy hoang viết 11:46 ngày 01/10/2018

mất thế nào dc, chắc bạn làm sai đâu đó thôi …

Vô Thin viết 11:43 ngày 01/10/2018

Có những lúc phải đặt hàm sau tất cả thẻ HTML, chỉ trước thẻ đóng body mà thôi. Tự động chạy thì cứ window.onload = stateUpdate

Lê Nhật Thanh viết 11:37 ngày 01/10/2018

Mình đã thử và không thành công. Nó vẫn mất hết thể HTML, và code mình khá đơn giản nên không sai được.

Quân viết 11:41 ngày 01/10/2018

Bạn thử như thế nào, không mô tả lỗi bằng lời của mình, hãy show kết quả làm

Lê Nhật Thanh viết 11:48 ngày 01/10/2018

Đây là toàn bộ file html của mình:

<!DOCTYPE html>
 <html>
 <head>
 	<title>Web server</title>
 	<meta name="description" content="Webserver"/>
 	<meta name="keyword" content="ubuntu"/>
 	<meta charset="utf-8"/>
 	<link rel="stylesheet" href="style.css">
 	
 </head>
 <body>
 	<div id="container">
 		<div id="menu">
 			<ul>
 				<li><a href="/index.html">Trang chủ</a></li>
 				<li><a href="/giamSat/giamsat.html">Giám sát</a></li>
 				<li><a href="#">LED</a></li>
 				<li>
 					<a href="#">IP Camera</a>
 					<ul class="sub-menu">
 						<li><a href="#">Theo dõi</a></li>
 						<li><a href="#">Webcam</a></li>
 					</ul>
 				</li>
 				<li>
 					<a href="#">App</a>
 					<ul class="sub-menu">
 						<li><a href="#">RFID</a></li>
 						<li><a href="#">UART</a></li>
 						<li><a href="#">USB</a></li>
 						<li><a href="#">Ethernet</a></li>
 					</ul>
 				</li>
 				<li><a href="#">Thông tin</a></li>
 			</ul>
 		</div><!menu>

 		<div id="content">
 			<div id="header">
 				<div id="logo"><img src="logo.png"></div><!them logo vao day>
 				<div id="slogan">
 					<p>Web server for NodeJS</p>
 				</div>
 			</div><!header>

 			<div class="call-to-action">
 				<h3>Tutorial made web server simple</h3>
 				<p>Điều khiển mọi thứ bằng web server</p>
 			</div><!call-to-action>

 			<div class="row" id="intro">
 			<h1>Trạng thái hiện tại: </h1>
 			<h1 id="state"></h1>
 			</div><!row>

 		</div><!content>
 	</div><!container>

 	<script type="text/javascript">
 		var HTTPrequest = new XMLHttpRequest();
 		function stateUpdate(){
			HTTPrequest.onreadystatechange = function(){
				if(this.readyState == 4 && this.status == 200){
					document.getElementById("state").innerHTML = this.responseText;
					document.write(this.responseText);
				}
			};
			HTTPrequest.open("GET", "state.asp", true);
			HTTPrequest.send();
		}
		window.onload = stateUpdate;
 	</script>
 </body>
 </html>

Và hình ảnh khi chạy file này:


Bạn xem giúp mình thử. Dữ liệu mình request được là “Lê Nhật Thanh”
Thanks bạn!

Y THAO viết 11:47 ngày 01/10/2018

tại vì cái document.write của bạn kìa. Đơn giản mà

Lê Nhật Thanh viết 11:50 ngày 01/10/2018

Thanks you very much! Thật là…

Bài liên quan
0