点击后带有额外数据的HTML下拉菜单

我需要在HTML中创建一个下拉菜单。我的想法是，当我点击选项时，假设一个城市，菜单下方会自动显示详细的联系信息。点击后带有额外数据的HTML下拉菜单

举例来说。如果我选择伦敦，自动应该显示街道地址，电话等。可以用下面的提交按钮，但更好没有。

<form action="process.php" method='post'> 
<select name="cities"> 
<option value="London">London</option> 
<option value="NY">NY</option> 
<option value="Rome">Rome</option> 
<option value="Paris">Paris</option> 
</select> 
<input type="submit" /> 
</form>

我不是HTML那么好，会很感激一些帮助

来源

2014-10-29 arteo

我没有时间给你答复的权利，但这将需要的JavaScript，所以你可能想的是添加到您的代码，以便javascripters可以找到你的问题。 – jcmiller11 2014-10-29 16:30:19

@arteo如果不想使用提交按钮，您可以使用ajax或者如果您使用提交按钮。在php中获取城市值并显示地址。 – Cherry 2014-10-29 16:33:50

这个信息存储在哪里？它在服务器上吗？它在某个地方被硬编码了吗？无论如何，你需要js。 – 2014-10-30 09:46:26

是this (check this fiddle)你在找什么？

所有你需要的是Javascript或Jquery的想法。以上小提琴中的代码仅供参考。为了更好的使用请参考Jquery Ajax。

代码是：

$('#cities').change(function(){ 
    var data = $('#cities :selected').val(); 
    document.getElementById("data").style.display = "block"; 
    if(data === "Paris") 
     document.getElementById("data").innerHTML = "You have selected Paris"; 
    else if(data === "Rome") 
     document.getElementById("data").innerHTML = "You have selected Rome"; 
    else if(data === "NY") 
     document.getElementById("data").innerHTML = "You have selected NY"; 
    else if(data === "London") 
     document.getElementById("data").innerHTML = "You have selected London";  
    else 
     document.getElementById("data").style.display = "none"; 
});

来源

2014-10-30 09:52:06 Chakri

点击后带有额外数据的HTML下拉菜单

回答

相关问题