0

我正在创建一个小型应用程序,在应用程序的一部分上,我正在创建一个下拉选择菜单,其中填充了数组中的值。

我遇到的问题是,当加载表单时,它成功加载并使用数组值填充选择选项,但问题是当我将另一个元素添加到数组并再次调用表单时,它仍然只会加载值从第一次调用表单时开始。

当我按下提交按钮时,我将如何让选择选项清除其值。这是调用的代码:

<div class="popupForm" id="newRelate_Form" style="display:none">
    <form name="relationFormOne">
        <script type="text/javascript" language="javascript">
            var $selectFrom = $('<select id="mySelect">');
            $($selectFrom).attr('id', 'objFrom');
            for (var i = 0; i < objectArray.length; i++)
            {
                var value = objectArray[i].Name;
                $('<option>').val(value).text(value).appendTo($selectFrom);
            }
            $selectFrom.appendTo($("#from_Object"));
            var fromVal = document.getElementById("objFrom");
        </script>
        <button class="closeDOMWindow" onclick="createObj(fromVal.options[fromVal.selectedIndex].text)">Create</button>
    </form>

然后将该值传递给函数 createObj():

function createObj()
{
    /*
        DO THE WORK NEEDED
    */
}

现在什么 javascript 代码会清除 select 选项,以便在再次调用它时可以重新填充放入数组中的任何新对象?

感谢您的任何反馈。

顺便说一句,弹出表单是指我使用以下 jquery 插件的事实:DOM Window

感谢您的任何反馈。

4

3 回答 3

1

纯 JavaScript:

var ob = document.getElementById('selectID');
while (ob.hasChildNodes())
    ob.removeChild(ob.firstChild);

jQuery:

$('#mySelect').children().remove()
于 2012-04-21T12:00:50.803 回答
0

不要忘记使用删除之前创建的选择标签$('#mySelect').remove(),然后运行该功能。

于 2012-04-21T12:15:13.183 回答
0

首先,添加一段 html 的最佳方式是从字符串中写入:

<form id="relationFormOne">

<script type="text/javascript" language="javascript">
$(function(){
var objectArray = [{Name:'1'},{Name:'2'},{Name:'3'}];
var selectHtml = [];

$('#relationFormOne').append($('<select name="mySelect">'));

$(objectArray).each(function(ix, val){
    selectHtml.push('<option>'+val.Name+'</option>');
});
$('select[name=mySelect]').html(selectHtml.join(''));
}); 
</script>

<input type="button" value="clear" onclick="$('select[name=mySelect]>option').remove()" />
</form>

当您想清除您的选择时,只需使用如下代码:

$('#mySelect>option').remove();
于 2012-04-21T12:21:07.047 回答