Question

我有一个包含div的列表，其中包含城市的信息。我还有一个城市列表，所以访客可以点击一个城市，而且所有其他城市的div必须隐藏如果访问者点击城市链接，隐藏的div必须再次显示。到目前为止，我有一个工作功能，但它只适用于伦敦。如果我点击巴黎 - 没有错误，没有行动。是什么导致这个？谢谢

已更新

<script language="javascript" type="text/javascript" charset="utf-8">      
function showHideDiv(city_id) {    
var divstyle = new String();    
divstyle = document.getElementById(city_id).style.visibility;    
if (divstyle.toLowerCase() == "visible" || divstyle == "") {     
document.getElementById("city_id").style.visibility = "hidden";    
document.getElementById("city_id").style.position = "absolute";             
}else{     
document.getElementById("city_id").style.visibility = "visible";    
document.getElementById("city_id").style.position = "relative";    
}    
}    
$(document).ready(function() {    
$(".city").click(function() {    
$(this).toggle();    
});    
});    
</script>    
<a href="#" id="<?php echo $city;?>" onclick="showHideDiv()" style="text-decoration:underline;">London | Paris</a></div>    
<div id="London">List of providers in London here as content</div>    
<div id="Paris">List of providers in Paris here as content</div>

Answer 1

我认为这与你的Javascript中包含硬编码的城市这一事实有关。我假设（没有看到PHP）你在这里回应“伦敦”：

<?php echo $city;?>

因此，无论何时调用showHideDiv（），它都只能在伦敦调用，而不是在巴黎调用。您可能需要将id作为参数传入函数。

您可以考虑查看jQuery。这会让这很容易。

修改

使用您的代码，您将传递参数，如下所示：

function showHideDiv(city_id) { var divstyle = new String(); divstyle = document.getElementById(city_id).style.visibility; // . . . Rest of your code. Replace all instances of <?php echo . . ?> with // city_id. }

然后，您必须在每个城市的onclick中指定城市。

使用jQuery，您可以执行以下操作：

$(document).ready(function() { $(".city").click(function() { $(this).toggle(); }); });

然后您的HTML将是：

<div id="london" class="city">List of providers in London</div> <div id="paris" class="city">List of providers in Paris</div>

javascript show id由id问题隐藏div

1 个答案: