Question

我目前正在尝试根据多个下拉列表创建搜索。

我使用的代码段如下：

    <script type="text/javascript" charset="utf-8">
        function add_criteria (el) {
            search = document.getElementById('search_criteria');
            search.value = document.getElementById('type').value + " " + document.getElementById('color').value;}
    </script>

    <form role="search" method="get" id="searchform" action="search.html?submit=Go&_nkw">
        <label class="screen-reader-text" for="s">Search for:</label>
    Type
    <select name='type' id='type' class='postform' onchange="add_criteria(this);">
      <option value='' selected='selected'>All</option>
      <option class="level-0" value="dog">Dog</option>
      <option class="level-0" value="cat">Cat</option>
    </select> 

    Color
    <select name='color' id='color' class='postform' onchange="add_criteria(this);">
      <option value='' selected='selected'>All</option>
      <option class="level-0" value="red">red</option>
      <option class="level-0" value="white">white</option>
      <option class="level-0" value="green">green</option>
    </select> 
       <input type="submit" id="searchsubmit" value="Search" />
      </div>
    </form>

然而结果不正确 - 我希望实现的结果是以这种方式显示结果：

    http://mystore.com/search.html?submit=Go&_nkw=medium+red

有没有人知道如何才能让这个替换刺痛得到修复和正常工作？

非常感谢一些建议 - 非常感谢你！

Answer 1

嗯，你只需要一个简单的技巧。首先从<select>代码中获取这些<form>代码，然后制作两个名称为<input>和submit的假_nkw（那就是<form>元素工作）：

<!DOCTYPE html>
<html>
<body>

<script type="text/javascript" charset="utf-8">
        function add_criteria (el) {
            search = document.getElementById('search_criteria');
            search.value = document.getElementById('type').value + " " + document.getElementById('color').value;}
    </script>

      <div>
        <select name='type' id='type' class='postform' onchange="add_criteria(this);">
            <option value='' selected='selected'>All</option>
            <option class="level-0" value="dog">Dog</option>
            <option class="level-0" value="cat">Cat</option>
        </select> 

        Color
        <select name='color' id='color' class='postform' onchange="add_criteria(this);">
            <option value='' selected='selected'>All</option>
            <option class="level-0" value="red">red</option>
            <option class="level-0" value="white">white</option>
            <option class="level-0" value="green">green</option>
        </select>
        </br>
        <form role="search" method="get" id="searchform" action="search.html">
            <input name="submit" value="Go" style="visibility:hidden;"></label>
            <input id="search_criteria" name="_nkw" value="" style="visibility:hidden;"></label>
            <input type="submit" id="searchsubmit" value="Search" />
        </form>
      </div>

</body>
</html>

多个下拉搜索替换字符串

1 个答案: