Question

我有一个html表，其行如下所示：

<tr>
    <td><input type="checkbox" name="check[]" value="265"></td>   
                 <td>265</td>
                    <td>NO MATCH</td>
                    <td>NO MATCH</td>
                    <td>No</td>
                    <td>0</td>
                    <td>f79a8316891</td>
              </tr>

我正在尝试构建一个jquery函数，只有当它以＆＃34; NO＆＃34; 。到目前为止，我有：

$( "td" ).hover( function() {
    var contents = $( this ).html() ;
    if (contents.match("^NO")) {
            function() {
            $( this ).append( $( "<span> ***</span>" ) );
            }, function() {
            $( this ).find( "span:last" ).remove();
            }
    }   


  });

但我在标题中收到错误。我做错了什么？

Answer 1

你的功能在错误的地方。尝试这样的事情：

$( "td" ).hover( function() {
    var contents = $( this ).html() ;
    if (contents.match("^NO")) {
        $( this ).append( $( "<span> ***</span>" ) );

    }   
}, function() {
        $( this ).find( "span:last" ).remove();
});

jQuery悬停函数将两个函数作为参数，第一个用于“鼠标悬停”，第二个用于“鼠标悬停”。您只需将这些功能放在原始代码中的错误位置即可。有关悬停的更多信息，请参阅http://api.jquery.com/hover/

Answer 2

没有必要在悬停时添加和删除内容。只需找到符合条件的所有单元格（使用jQuery's filter()），然后给他们一个班级。然后，您可以根据需要设置.nomatch个元素的样式。在这里，我根据您的要求在悬停时添加了三星级文本。

$(function(){
  var key = "NO";
  var $cellsBeginWithNo = $("td").filter(function(){
    var $this = $(this);
    if($this.text().indexOf(key) === 0){ //if text begins with [key]
        $this.addClass("nomatch");       //give it a class
        return $this;                    //add it to our collection
    }
    return false;
  });
  /* 
    Now you have a jQuery collection of matched elements that you can apply further functions to if you like. EG: 
    $cellsBeginWithNo.on("click", function(){alert("click");});
  */
});

td.nomatch {
    background-color:#ffeeee;
}
td.nomatch:hover:after {
    content : " ***";
    color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
    <tr>
        <td><input type="checkbox" name="check[]" value="265"></td>   
        <td>265</td>
        <td>NO MATCH</td>
        <td>NO MATCH</td>
        <td>No</td>
        <td>0</td>
        <td>f79a8316891</td>
    </tr>
</table>

Javascript：函数语句需要一个名称

2 个答案: