Saya cuba membuat halaman web menggunakan php, pada elemen kelas "Continuous TextBox" (ditakrifkan oleh kelas saya), apabila diklik saya perlu memulakan fungsi Javascript yang sepatutnya menukar kandungan id fungsi lain "harta- unsur modal", tetapi ini tidak berlaku. Saya terus mendapat ralat yang sama, "Uncaught TypeError: Cannot set property of undefined (set 'innerHTML')" walaupun fungsi itu diisytiharkan selepas elemen yang sepatutnya berubah, dan kawalan yang saya tulis di dalamnya Log Taiwan Fungsi ini tidak tidak kembali null. Apa yang saya buat salah?
<?php
session_start();
if (!isset($_SESSION['username']) && !isset($_SESSION['password'])){
echo "<script>location.href='loginPage.html'</script>";
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Crisis Containment Service</title>
<link rel="icon" href="https://www.pinclipart.com/picdir/middle/344-3442781_tornado-icon-animated-natural-disaster-png-clipart.png">
<link href="style1.css" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1 id="titlu-pagina">Crisis Containment Service Web App</h1>
<div id="slider">
<figure>
<img src="Images/wildfire.jpg">
<img src="Images/furtuna.jpg">
<img src="Images/hurricane.jpg">
<img src="Images/landslide.jpg">
<img src="Images/tornada.jpg">
<img src="Images/vulcan.jpg">
<img src="Images/inundatie.jpeg">
<img src="Images/wildfire.jpg">
</figure>
</div>
<div id="text-box">
<?php
$url = 'http://localhost/Proiect/API/getVerifiedEvents.php';
$curl = curl_init($url);
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
$headers = array("Accept: application/json",);
curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
$resp = curl_exec($curl);
curl_close($curl);
$json = json_decode($resp);
$i = 0;
while($i < sizeof($json)){
//if (substr($json[$i]->name, 0, 5) == date("m-d")){
?>
<div class="continut-text-box" id="open" onclick="makeMap(<?php echo $json[$i]->longitude?>, <?php echo $json[$i]->latitude?>)"><h2><?php echo $json[$i]->description;?></h2></div>
<?php /*}*/$i = $i + 1;}?>
</div>
<div class="modal-container" id="modal-container">
<div class="modal">
<!--<h1>Hi!</h1>!-->
<div id="harta-modal"><p>te rog functioneaza<!--to be generated by javascript!--></div>
</div>
<button id="close">X</button>
</div>
<iframe id="harta-europa" src="https://www.google .com/maps/embed?pb=!1m18!1m12!1m3!1d47139330.24912588!2d-12.8611109417314!3d43.85258716626324!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46ed8886cfadda85%3A0x72ef99e6b3fcf079!2sEurope!5e0!3m2!1sen!2sro!4v1649962131724!5m2!1sen!2sro" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
<button id="buton-about" onclick="window.location.href='about.html';">About</button>
<button id="buton1" onclick="myFunction1()">Log Out</button>
<button id="buton2" onclick="myFunction2()">Report Event</button>
<select id="type-event">
<option selected>All</option>
<option>Tornadoes</option>
<option>Hurricanes</option>
<option>Floods</option>
<option>Wildfires</option>
<option>Earthquakes</option>
<option>Droughts</option>
<option>Volcanic erruptions</option>
<option>Tsunamis</option>
<option>Landslides</option>
<option>Sink holes</option>
</select>
<input type="datetime-local" name="datetime" id="datetime">
<script src="myScript.js"></script>
<script>
function myFunction1() {
location.href='sessionDestroy.php';
}
function myFunction2() {
location.href='reportEventPage.php';
}
function makeMap(longitude, latitude){
console.log(document.getElementById('harta-modal'));
document.getElementById('harta-modal')[0].innerHTML = `${longitude} ${latitude}`;
}
</script>
</body>
</html>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Apabila menggunakan
getElementById获取元素时，您不必使用[0]akses elemen pertama kerana ia hanya boleh mengembalikan satu elemen.Dari dokumentasi mozilla:
Jadi hanya gunakan:
function makeMap(longitude, latitude){ console.log(document.getElementById('harta-modal')); document.getElementById('harta-modal').innerHTML = `${longitude} ${latitude}`; }