在第二次更改选择选项时

时间:2017-11-09 14:23:38

标签: javascript forms drop-down-menu

我正在使用html,php和javascript创建一个网页。 我使用脚本选择选项。我在执行代码时遇到的问题是第一个输入字段在再次选择选项时不会消失。相反,我得到第二个输入框和第一个输入框。即使我使用if else条件,我也会得到两者。

var fil = document.getElementById("filter");
fil.onchange = function filteron() {
  var filtertag = document.getElementById("filter");
  var tag = filtertag.options[filtertag.selectedIndex].value;
  var searchbox = document.createElement("input");
  var filter = document.getElementById("criteriain");
  searchbox.setAttribute("id", "criteria");
  if (tag === 'ed') {
    searchbox.setAttribute("type", "date");
    searchbox.setAttribute("name", "searchin");
  } else if (tag === 'gw') {
    searchbox.setAttribute("type", "number");
    searchbox.setAttribute("name", "searchin");
  }
  filter.appendChild(searchbox);

};
<form action="" method="post">
  <label for="filter" id="filterin">Filter by</label>
  <select id="filter" size="1" name="filter" onchange="filteron()">
                <option value='slno' >Sl No</option>
                <option value='ed' >Entry Date</option>
                <option value='lot' >Lot No</option>
                <option value='par' >Party</option>
                <option value='var' >Variety</option>
                <option value='cst' >Current status</option>
                <option value='gw' >Gray width</option>
            </select>
  <br/>

  <label for='criteria' id='criteriain'>Search for</label>

1 个答案:

答案 0 :(得分:0)

这是因为不管你的选择是什么,你每次都在创建一个新元素,只改变if / else块中的类型为新元素。

Xmn1025k
final