訪客如何通過文本字段將選項添加到菜單中？

我有以下的下拉菜單。訪客如何通過文本字段將選項添加到菜單中？

<select id="MySelectMenu"> 
<option value="#">-*-*- Main Accounts -*-*-</option> 
<option value="http://www.google.com">Google</option> 
<option value="http://www.yahoo.com">Yahoo</option> 
<option value="http://www.example.com">Example</option> 
</select>

我可以添加兩個文本輸入字段，其中訪問者可以自己填充菜單選項嗎？

例如，在文本字段中，他們輸入選項的url和文本字段2，他們輸入選項的名稱。

所以...... 文本字段中的一個：http://www.randomwebsite.com 文本字段中的兩個：隨機網站

隨後的 '添加' 按鈕，這將導致這...

<select id="MySelectMenu"> 
<option value="#">-*-*- Main Accounts -*-*-</option> 
<option value="http://www.google.com">Google</option> 
<option value="http://www.yahoo.com">Yahoo</option> 
<option value="http://www.example.com">Example</option> 
<option value="http://www.randomwebsite.com">Random Website</option> 
</select>

這是當前菜單的JavaScript，如果這有幫助。

<script type="text/javascript"> 
function newSrc() { 
    var e = document.getElementById("MySelectMenu"); 
    var newSrc = e.options[e.selectedIndex].value; 
    document.getElementById("MyFrame").src=newSrc; 
} 
</script>

在此先感謝。

來源

2014-10-27 AdamH

將id添加到兩個選項標籤中，並在javascript中獲取它們的id，獲取它們的值以及內部文本？ – 2014-10-27 11:45:42

@AdamH - 如果您可以使用JQuery。比你可以使用'.append（）'功能 – prog1011 2014-10-27 11:51:21

@MrCoder謝謝你兩個:)請問有人會詳細說明我的代碼嗎？否則，我會做一些研究，添加ID和值:) – AdamH 2014-10-27 11:54:29

是創建兩個文本框，並添加標識的，對他們也創造了的onclick功能的按鈕「添加」，然後使用下面的JavaScript這只不過是創建選項，並追加到選擇框

function Add() 
{ 
    var x = document.getElementById("MySelectMenu"); 
    var opt = document.createElement("option"); 
     opt.value= document.getElementById("url").value; 
     opt.innerHTML = document.getElementById("name").value; // whatever property it has 
     x.add(opt); 

} 


<select id="MySelectMenu"> 
     <option value="#">-*-*- Main Accounts -*-*-</option> 
     <option value="http://www.google.com">Google</option> 
     <option value="http://www.yahoo.com">Yahoo</option> 
     <option value="http://www.example.com">Example</option> 
    </select> 
    <input type="text" name="name" id="name"> 
    <input type="url" name="url" id="url"> 
    <button onclick="Add()">ADD</button>

來源

2014-10-27 11:53:25 Choco

非常感謝。我目前正在學習javascript的基礎知識......你的幫助使我學得更快，謝謝:) – AdamH 2014-10-27 12:14:04

嘗試下面的代碼

var url=$("#txtUrl").val(); var textValue = $("#txtDisplay").val(); $('#MySelectMenu').append("<option value='"+url+"'>"+textValue+"</option>);

使用此代碼對OnClick事件添加按鈕。

來源

2014-10-27 11:56:30 prog1011

訪客如何通過文本字段將選項添加到菜單中？

回答

相關問題