Question

任务：

使用选项创建下拉列表，并根据选择反映所选选项。

问题

设法创建下拉列表以及显示所选选项的语法。但是，我正面临一个问题，即当用户选择＆＃34; Option1＆＃34;，＆＃34; Option_1＆＃34;将显示，当用户继续选择＆＃34; Option2＆＃34;，＆＃34; Option_2＆＃34;也将显示在＆＃34; Option_1＆＃34;的顶部。＆＃34; Option_1＆＃34;不会删除，只有＆＃34; Option_2＆＃34;将显示。因此，如果用户要选择所有5个选项，用户将看到显示的所有5个选项，而不是显示最新选项。

我尝试在$("(id_name)").empty()中使用function val(x)，当我这样做时，没有选择任何选项。

代码：

<script>
function val(x)
{
    if (x =="Others" )
    {
            document.getElementById("extradiv").style.display ="block";           
    }
    else if (x =="Name 1")
    {
            document.getElementById("Name1").style.display = "block";
    }else if (x =="Name 2")
    {
            document.getElementById("Name2").style.display = "block";
    }else if (x =="Name 3")
    {
            document.getElementById("Name3").style.display = "block";
    }
}
</script>

下拉列表代码：

<p>
<select name ="Agency" id="AgencyDetails" onchange = "return val(this.value);">
<option value ="0" selected = "selected"> Select Agency..</option>
<option value ="Name 1"> Bob</option>
<option value ="Name 2"> Amanda</option>
<option value ="Name 3"> Gen</option>
<option value = "Others"> Others</option>
</select>
</p>

ExtraDiv代码：

<div id = "extradiv" style ="display:none">
                    <li>
                            <label>Person Name:</label>
                            <input type="text" class="fieldInput" id="Name" value="" title="Address" />

                    </li>
                    <li>
                            <label>Name Registration Number:</label>
                            <input type="text" class="fieldInput" id="nameCompanyAddress" value="" title="Address" />

                    </li>
                    <li>
                            <label>Name Address:</label>
                            <input type="text" class="fieldInput" id="nameCompanyAddress" value="" title="Address" />

                    </li>
</div>

名1：

<div id = "Agency1" style ="display:none">
            <li><label>Name:</label>Name1

            </li>
            <li><label>Name Registration Number:</label>Name Registration Num 1
            </li>
            <li><label>Name Address:</label>Name Address 1
            </li>
            </div>

因此，Name1和Name2以及Name2格式是相同的。

任何人都可以请帮助

Answer 1

你可以试试这样的事情

function val(x) {
    document.getElementById("extradiv").style.display = x == "Others" ? "block" : "none";
    document.getElementById("Name1").style.display = x == "Name 1" ? "block" : "none";
    document.getElementById("Name2").style.display = x == "Name 2" ? "block" : "none";
    document.getElementById("Name3").style.display = x == "Name 3" ? "block" : "none";
}

选择新选项

1 个答案: