點擊後帶有額外數據的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下拉菜單

回答

相關問題