1

我对 jQuery 有点陌生，我只是想知道如何传递一个字符串值，而不是看起来像是从选择器中对 jQuery 项目的引用？我很难解释，所以这里有一个示例演示。甚至不知道该标题是什么，所以如果您能想到更好的标题，请在编辑标题时进行。

在我执行$("td").filter(function(str){ str 的行中，传入的 str 成为我所在的 TD 的索引位置。因此，在第一次调试时，它是 0，下一次是 1，依此类推。我尝试了谷歌，但我什至不确定要搜索什么，任何文档/代码帮助将不胜感激

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("select[name='showTeam']").change(function () {
            $("select[name='showTeam'] option:selected").each(function () {
                var str = $(this).val().toLowerCase();
                //str = what it was set to up there
                //alert(str);
                $("td").filter(function(str) {
                    //str = becomes a number = to position of TD.. ie for 5th TD match STR = 4 (starts at index 0)
                    return $(this).text().toLowerCase().indexOf(str) != -1;
            }).css('background','red');
        });
    })
});
</script>
Show Team: <select id="showTeam" name="showTeam">
    <option>All</option>
    <option>Chelsea</option>
    </select>

<div id="games">
  <table border="1">
  <tbody>
  <tr>
    <th>ID</th>
    <th>Game date</th>
    <th>Field</th>
    <th>Home team</th>
    <th>Home team score</th>
    <th>Away team</th>
    <th>Away team score</th>
    <th>Game type</th>
  </tr>
  <tr class="odd_line" id="game_460">
    <td>459</td>
    <td>03 Nov 19:00</td>
    <td>Field 2</td>
    <td>Madrid </td>
    <td>3</td>
    <td>Bayern Munich </td>
    <td>1</td>
    <td>Season</td>
  </tr>
  <tr class="odd_line" id="game_461">
    <td>460</td>
    <td>03 Nov 19:00</td>
    <td>Field 3</td>
    <td>chelsea</td>
    <td>5</td>
    <td>arsenal</td>
    <td>4</td>
    <td>Season</td>
  </tr>
</div>
4

3 回答 3

1 
$(document).ready(function(){
    $("#showTeam").change(function () {
        var searchFor = $(this).val().toLowerCase();
        $("#games table tbody tr td:contains('" + searchFor + "')").parent().css('background','red');
    })
});

演示

于 2012-02-16T19:31:23.063 回答
1 
$(document).ready(function(){
    $("#showTeam").change(function() {
        var target = $("#showTeam").val();
        $("#games td:contains(" + target + ")").css('background','red');
    });
});

我制作了一个 jsfiddle 来证明这一点。 http://jsfiddle.net/Zf5dA/

注意： :contains()区分大小写，所以我必须在表格中将“Chelsea”大写。我简化了 select 元素上的选择器——它有一个 id，所以我选择了它。更快更简单。这将找到包含td文本的单元格，但它们也可以包含其他文本。这会让你开始。

于 2012-02-16T19:32:45.370 回答
1

嗯，是。第一个参数将引用匹配元素集中元素的索引。做就是了：

...
$("select[name='showTeam'] option:selected").each(function() {
    var str = $(this).val().toLowerCase();

    $("td").filter(function() {

        return $(this).text().toLowerCase().indexOf(str) != -1;
    }).css('background', 'red');​
    ...

因为str将在filter回调函数的范围内可用。

从文档：

.filter（函数（索引））

函数（索引）用于测试集合中每个元素的函数。这是当前的 DOM 元素。

于 2012-02-16T19:20:14.647 回答