在下拉列表中插入值。是否可以？

debugcn 发表于 Dev

阿尼斯

我想问一下是否可以使用输入文本在下拉列表中添加值？这是下拉列表的代码。如何编码？

  <select class="form-control" name="txt_university">
                    <option></option>
                        <option>University of Malaya</option>
                        <option>Universiti Sains Malaysia</option>
                        <option>Universiti Teknologi Malaysia</option>
                        <option>Universiti Teknologi MARA</option>
                        <option>Universiti Putra Malaysia</option>
                        <option>Universiti Kebangsaan Malaysia</option>
                        <option>Universiti Malaysia Sabah</option>
                        <option>Universiti Tenaga Nasional</option>
                        <option>Multimedia University</option>
                        </select>

这是用户插入另一所大学的代码。当用户插入大学时，它将存储在下拉列表中。

 <div class="control-group">
                      <label class="control-label">Add University</label>
                      <div class="controls">
                       <input name="txt_university" type="text" class="input-xxlarge"/> name="save">Add</button>
                      </div>
                    </div>

赫尔沃耶·安图诺维奇

您需要附加一个函数，当单击按钮时，该函数将从输入字段中获取值并将其以选项的形式发送到选择元素。

var button = document.getElementById('button');

button.addEventListener('click', function() {
 

var newUniversity = document.getElementById("new_university").value;
var universityList = document.getElementById("university_list");

 universityList.options[universityList.options.length] = new Option(newUniversity, newUniversity);

});

<select id="university_list" class="form-control" name="txt_university">
                    <option></option>
                        <option>University of Malaya</option>
                        <option>Universiti Sains Malaysia</option>
                        <option>Universiti Teknologi Malaysia</option>
                        <option>Universiti Teknologi MARA</option>
                        <option>Universiti Putra Malaysia</option>
                        <option>Universiti Kebangsaan Malaysia</option>
                        <option>Universiti Malaysia Sabah</option>
                        <option>Universiti Tenaga Nasional</option>
                        <option>Multimedia University</option>
                       </select>
                        
                        <div class="control-group">
    <label class="control-label">Add University</label>
    <div class="controls">
        <input id="new_university" name="txt_university" type="text" class="input-xxlarge"/>
        <button name="save" id="button" type="button">Add</button>
    </div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。