為什么陣列 2 沒有切換?
"-" 切換," " 不切換

php代碼:
$html = '';
$array = array('1' => 'Airport', '2' => 'Restaurant', '3' => 'Market');
foreach ($array as $key => $name) {
$x = $key;
$html .= '<table ><tr>';
$html .= '<td><a href=\'javascript:toggle("' . $x . '");\'>
<img id="' . $x . '_img_1" src="../img/expandable_1.gif" width="9" height="9"/>
<img id="' . $x . '_img_2" src="../img/expandable_2.gif" width="9" height="9" style="display:none"/> ' . $name . '</a>
</td>';
$html .= '</tr></table>';
$html .= '<div id="' . $x . '_div_1" style="margin-left:15px;display:none;">';
$html .= '</div>';
}
echo $html;
javascript:
function toggle(type) {
var a = $('#' type '_div_1');
var b = $('#' type '_img_1');
var c = $('#' type '_img_2');
if (a.is(':visible')) {
a.hide();
b.show();
c.hide();
} else {
a.show();
b.hide();
c.show();
}
}
臨時修復:我試圖將我的餐廳陣列索引更改為 3。示例:“$array = array('1' => 'Airport', '3' => 'Restaurant', '4' => 'Market'); ”
不知何故,當我將索引指定為 2 時,它不會切換。將索引設定為 2 時遇到問題
附加資訊:當我在 js 上添加警告行時。當我單擊餐廳時,警報會提示但仍未切換
uj5u.com熱心網友回復:
你真的需要委托
我已經簡化了整個事情 - 擺脫了不必要的表格和影像
window.addEventListener("load",function() {
document.getElementById("container").addEventListener("click",function(e) {
const tgt = e.target.closest("a");
if (tgt && tgt.classList.contains("toggle")) {
e.preventDefault(); // stop link
let isHidden = tgt.nextElementSibling.hidden;
tgt.nextElementSibling.hidden = !isHidden;
tgt.querySelector("span.exp").classList.toggle("plus",!isHidden)
tgt.querySelector("span.exp").classList.toggle("minus",isHidden)
}
})
})
.content {
margin-left: 15px;
}
.pad-3 {
padding: 3px
}
a.toggle {
text-decoration: none
}
.exp {
font-size: 12px;
padding-right: 10px;
}
.exp.plus::after {
content: "?"
}
.exp.minus::after {
content: "?"
}
<div id="container">
<a href="#" class="pad-3 toggle"><span class="exp plus"></span>Airport</a>
<div class="content" hidden>Airport</div><br/>
<a href="#" class="pad-3 toggle"><span class="exp plus"></span>Restaurant</a>
<div class="content" hidden>Restaurant</div><br/>
<a href="#" class="pad-3 toggle"><span class="exp plus"></span>Market</a>
<div class="content" hidden>Market</div><br/>
</div>
PHP
<div id="container">
<?php
$array = array('1' => 'Airport', '2' => 'Restaurant', '3' => 'Market');
foreach ($array as $key => $name) { ?>
<a href="#" class="pad-3 toggle"><span class="exp plus"></span><?= $name ?></a>
<div class="content" hidden>
<?= $name ?>
</div><br/>
<? } ?>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/370008.html
標籤:javascript php html 数组
