0

是否可以在表单中添加一个下拉菜单，并且该函数会将下拉菜单中的选定值和文本字段的值结合起来进行搜索？

该代码应用于 HTML 表格，以便访问者可以在表格中进行搜索。

谢谢！:)

<script type="text/javascript">

function search (phrase, _id){
    var words = phrase.value.toLowerCase().split(" ");
    var table = document.getElementById(_id);
    var ele;
    for (var r = 0; r < table.rows.length; r++){
        ele = table.rows[r].innerHTML.replace(/<[^>]+>/g,"");
        var displayStyle = 'none';
        for (var i = 0; i < words.length; i++) {
            if (ele.toLowerCase().indexOf(words[i])>=0)
                displayStyle = '';
            else {
                displayStyle = 'none';
                break;
            }
        }
        table.rows[r].style.display = displayStyle;
    }
}

</script>

<form>

<b>Words:</b>

<input name="filter" onkeyup="search(this, 'my-table', 1)" type="text">

</form>
4

2 回答 2

0

也许我做错了什么..

function search (phrase, _id){
    var words = phrase.value.toLowerCase().split(" ");

    var dd = document.getElementById("education");
    words.push(dd.options[dd.selectedIndex].text);

    var table = document.getElementById(_id);
    var ele;
    for (var r = 0; r < table.rows.length; r++){
        ele = table.rows[r].innerHTML.replace(/<[^>]+>/g,"");
        var displayStyle = 'none';
        for (var i = 0; i < words.length; i++) {
            if (ele.toLowerCase().indexOf(words[i])>=0)
                displayStyle = '';
            else {
                displayStyle = 'none';
                break;
            }
        }
        table.rows[r].style.display = displayStyle;
    }
}

</script>

<form>

<b>Words:</b>

<input name="filter" onkeyup="search(this, 'my-table', 1)" type="text"><br>

<b>Education:</b>

<select id="education">
   <option value="">Select</option>
   <option value="MBO">MBO</option>
   <option value="HBO">HBO</option>
   <option value="University">University</option>
</select>

</form>
于 2013-08-22T18:26:35.217 回答
0

var words = phrase.value.toLowerCase().split(" ");
试试这个之后：

var dd = document.getElementById("your_dropdown_id");
words.push(dd.options[dd.selectedIndex].text);

.
.
更新：

上面显示的是您原始问题的答案。现在你有一些不同的问题。

您的问题是，您正在搜索一个包含大写字母的字符串（即“HBO”或“MBO”），该字符串中的所有字母均为小写（您已ele.toLowerCase()在您的if条件下使用过。）
现在试试这个： 

var displayStyle = 'block';
for (var i = 0; i < words.length; i++)
    if (ele.toLowerCase().indexOf(words[i].toLowerCase()) == -1) {
        displayStyle = 'none';
        break;
    }

在整个上面显示的代码中，初始化displayStyle并'block'更改它是此逻辑的最佳方式。 希望这能解决您的问题。break;

于 2013-08-22T10:25:24.167 回答