选择另一个列表框值时如何清除列表框值

Question

我创建了一个取决于单选按钮的单击列表框，如果用户单击一个单选按钮列表框将显示该框，并且用户再次选择其他选项，但它不清除列表框的先前值，则如何通过javascript清除？

<script language="JavaScript"  type="text/javascript">
        function fun(s)
        {

             if(s==B)
            {
                  document.getElementById("maingroup").style.display='none';
                  document.getElementById("subgroup").style.display='';
                  document.getElementById("itemname").style.display='none';

              }

             if(s==C)
            {
                 document.getElementById("maingroup").style.display='none';
                 document.getElementById("subgroup").style.display='none';
                 document.getElementById("itemname").style.display='';


              }


        </script>

这是我尝试过JS FIDDLE的示例

Answer 1

这是我的想法（未经测试）。 给每个列表框一个类名，例如class='lst' 。 之后，当您单击单选按钮时，只需使用：

  `document.getElementsByClassName('lst').style.display = 'none';`

并显示当前列表框。

`document.getElementsByClassName('currentListboxID').style.display = 'block';`

这是演示

Answer 2

尝试这个：

var listBox = document.getElementById("listboxID");
listBox.innerHTML = "";

Answer 3

我认为show / hide方法不适合编程。

我不知道它是否有用，但这可能对您有所帮助。

您可以使它像

var mainGroup = ["aa","bb","cc"];
var subGourp = ["dd","ee","ff"];
var itemName = ["gg","ee","ff"];

var Country = ["jj","hh","ii"];
var Zone = ["kk","ll","mm"];

if(s == A)
{
    var i=0;
    var str = "";
    for(i=0;i<mainGroup.length;i++)
    {
        str += "<option value='" + (i+1) + "'>" + mainGroup[i] + "</option>";

    }
    document.getElementById("maingroup").style.display='';
    document.getElementById("maingroup").innerHTML = str;
}
else if(s == B)
{
    var i=0;
    var str = "";
    for(i=0;i<subGourp.length;i++)
    {
         str += "<option value='" + (i+1) + "'>" + subGourp[i] + "</option>";

    }
    document.getElementById("maingroup").style.display='';
    document.getElementById("maingroup").innerHTML = str;
}