[英]javascript (document.getelementbyid) in an echo not working (probably wrong usage of quotes)
我正在運行一會兒(php),它會在onclick時打開行,從而建立行。 但我無法在回顯中正確獲取javascript。
我在互聯網上讀了很多書,但沒有一個人像我一樣使用過多的引號。
比以前多一些細節。 有一個名為“ nuujts”的數據庫,其中包含一個“ id”,“ titel”,“ subtitel”,“ inhoud”(內容),“ aafbeelding”(服務器上的html img src =)
underneight是一個硬編碼版本的示例,現在需要從mysql服務器中提取該版本
document.getElementByID應該為$ row ['id']
<li onclick="document.getElementById('2').style.display='block'" class="w3-border">
<a href="#">
<div class="w3-row">
<img src="images/tumbnail.png" class="w3-image w3-third">
<div class="w3-twothird"><h6>Leever Bontje Middig</h6>Bòntje middig geörganiseerd door V.V. De Tuinhagedisse</br></br>Laes verder -></div>
</div>
</a>
</li>
<div id="2" class="w3-modal">
<div class="w3-modal-content w3-text-black w3-animate-zoom">
<header class="w3-container w3-text-white" style="background-color: #005415;">
<span onclick="document.getElementById('2').style.display='none'" class="w3-button w3-xlarge w3-hover-red w3-display-topright" title="Sjloete">×</span>
<h2>Leever Bòntje Middig</h2>
</header>
<p>Bòntje middig geörganiseerd door vv de Tuinhagedisse</p>
Bòntje middig geörganiseerd door vv de Tuinhagedisse veur miense oet Leeve én omsjtreke!</br>
Mit o.a. optraejes van Toeter Thijs en Pyure.</br>
De middig begint om 14.00 oer (zaal aope vanaaf 13.30 oer).</br>
<p>Ein kaertje kost €5,00, daoveur krieg geer entree & koffie mit vlaai.</p>
<p>Sjpisjaal veur de miense die van boete Leeve komme, is dur GRATIS verveur geregeld. Opsjtapplaatse: de Donderie en 't Paradies.</p>
Kaertjes kinne besjteld waere via:</br>
julia.orval@gmail.com óf jmhn@xs4all.nl</br>
Gaef naam, adres, tillefoonnummer en 't aantal luuj door véúr 27 fibberwarie. VOL=VOL</br>
Wilt geer meer informatie hubbe? Gebroek dan baovesjtaonde mailadressen of bel nao 06-16353489.
</div>
</div>
<?php
$sql = "SELECT * FROM nuujts";
$result = $conn->query($sql);
if ($result->num_rows > 0 ) {
while ($row = $result->fetch_assoc()) {
echo "<li onclick='document.getElementById(".$row['id'].").style.display'block'' class='w3-border'>";
echo "<a href='#'>";
echo "<div class='w3-row'>";
echo $row['aafbeelding'];
echo "<div class='w3-twothird'><h6>".$row["titel"]."</h6>".$row["subtitel"]."</br></br>Laes verder -></div>";
echo "</div>";
echo "</a>";
echo "</li>";
echo "<div id='".$row["id"]."' class='w3-modal'>";
echo "<div class='w3-modal-content w3-text-black w3-animate-zoom'>";
echo "<header class='w3-container w3-text-white' style='background-color: #005415'>";
echo "<span onclick='document.getElementById(".$row['id'].").style.display='none'' class='w3-button w3-xlarge w3-hover-red w3-display-topright' title='Sjloete'>×</span>";
echo "<h2>".$row["titel"]."</h2>";
echo "</header>";
echo "<p>".$row["subtitel"]."</p>";
echo $row["inhoud"];
echo "</div>";
echo "</div>";
}
}
?>
什么都沒有發生,但應該打開模態。 我相信問題在於報價,但我無法正確使用報價
您總是可以簡化您的PHP,而不是嵌入javascript,而是依靠PHP之外的javascript。
首先,取代的onclick,輸出ID到的數據屬性id
和添加一個附加的類。 然后使用javascript添加點擊事件處理程序。
echo "<li data-id='{$row['id']}' class='show-modal w3-border'>";
echo "<span data-id='{$row['id']}' class='hide-modal w3-button w3-xlarge w3-hover-red w3-display-topright' title='Sjloete'>×</span>";
var objs = document.getElementsByClassName('show-modal');
for(var i = 0; i < objs.length; i++) {
(function(index) {
objs[index].addEventListener("click", function() {
document.getElementById(this.dataset.id).style.display = 'block';
})
})(i);
}
var objs = document.getElementsByClassName('hide-modal');
for(var i = 0; i < objs.length; i++) {
(function(index) {
objs[index].addEventListener("click", function() {
document.getElementById(this.dataset.id).style.display = 'none';
})
})(i);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.