1

我有一个包含城市信息的 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>    
4

1 回答 1

2

我想这与您的 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>
于 2013-02-08T14:50:17.290 回答