Javascript Html可选框所选问题

我有一个选择项目的html列表。有一个值名：other，如果选中该值，我希望显示文本输入

下面是我的代码。如果用户选择除

其他

之外的任何选项，则文本输入应隐藏。当用户从选择菜单中选择

other

时，如何显示此文本字段

<td>
    Interest <span style="color:#F00;">*</span>
</td>
<td>
    <select name="interest" id="travel_arriveVia" onchange="showfield(this.options[this.selectedIndex].value)">
        <option value="art" <?php if ($g_interest=="art" ) echo 'selected = "selected"'; ?>>Art</option>
        <option value="litteratures" <?php if ($g_interest=="litteratures" ) echo 'selected = "selected"'; ?>>Litteratures</option>
        <option value="business" <?php if($g_interest=="business" ) echo 'selected = "selected"'; ?>>Business</option>
        <option value="internet" <?php if($g_interest=="internet" ) echo 'selected = "selected"'; ?>>Internet</option>
        <option value="other_interest" <?php if($g_interest=="internet" ) echo 'selected = "selected"'; ?>>Other</option>
    </select>

    <script type="text/javascript">
        function showfield(name) {
            if (name == 'other_interest') document.getElementById('div1').innerHTML = '<input type="text" name="other_interest" class="trother" />';
            else document.getElementById('div1').innerHTML = '';
        }
    </script>
    <div id="div1"></div>
</td>

兴趣*
>垃圾
>互联网
代替div1，您可以执行以下操作：

<select name="interest" id="travel_arriveVia" onchange="showfield(this.options[this.selectedIndex].value)">
        <option value="art" <?php if ($g_interest=="art" ) echo 'selected = "selected"'; ?>>Art</option>
        <option value="litteratures" <?php if ($g_interest=="litteratures" ) echo 'selected = "selected"'; ?>>Litteratures</option>
        <option value="business" <?php if($g_interest=="business" ) echo 'selected = "selected"'; ?>>Business</option>
        <option value="internet" <?php if($g_interest=="internet" ) echo 'selected = "selected"'; ?>>Internet</option>
        <option value="other_interest" <?php if($g_interest=="internet" ) echo 'selected = "selected"'; ?>>Other</option>
</select>

<input type="text" name="other_interest" id="txtOther" class="trother" style="display: none;" />

<script>
  function showfield(name) {
        if (name == 'other_interest') document.getElementById('txtOther').style = 'display: block;';
        else document.getElementById('txtOther').style = 'display: none;';
    }
</script>


>垃圾
>互联网
将文本输入保留在那里，但在更改选择时只显示和隐藏它

<select name="interest" id="travel_arriveVia" onchange="showfield(this.options[this.selectedIndex].value)">
    <option value="art" <?php if ($g_interest=="art" ) echo 'selected = "selected"'; ?>>Art</option>
    <option value="litteratures" <?php if ($g_interest=="litteratures" ) echo 'selected = "selected"'; ?>>Litteratures</option>
    <option value="business" <?php if($g_interest=="business" ) echo 'selected = "selected"'; ?>>Business</option>
    <option value="internet" <?php if($g_interest=="internet" ) echo 'selected = "selected"'; ?>>Internet</option>
    <option value="other_interest" <?php if($g_interest=="other_interest" ) echo 'selected = "selected"'; ?>>Other</option>
</select>

<input type="text" id="other_interest" name="other_interest" class="trother" style="<?php if($g_interest != 'other_interest') echo 'display:none;'; ?>" />

<script type="text/javascript">
    function showfield(name) {

        var input = document.getElementById("other_interest");
        if (name == 'other_interest') {
            input.style.display = "";
        } else {
            input.style.display = "none";
        }
    }
</script>


>垃圾
>互联网
这很好，但如果用户错误地输入了其他字段，那么表单将重新加载，但用户无法看到用户输入的其他字段值。需要更具体。你看到我对if（$g_interest==“other_interest”）
行的更改了吗？因为您正在检查internet，而它应该是其他感兴趣的。