Question

例如我有这张表

<table class="table">
    <tr>
        <td>123</td>
        <td>456</td>
        <td>123</td>
        <td>456</td>
    </tr>
</table>

和此列表

<ul>
    <li>123</li>
    <li>456</li>
</ul>

是否可以使用jQuery将style="background: yellow"添加到与<td>元素具有相同值的<li>元素中。它应该是onclick或onhover事件。

Answer 1

您可以使用以下内容;

$("td").on("mouseover", function () {
    var tdVal = $(this);
    $("li").each(function() {
        if ($(this).text() == tdVal.text()) {
            tdVal.css("background", "yellow");    
        }
    });   
}).on("mouseleave", function() {
    $(this).css("background", "white");    
});

以下是一个有效的演示： jsFiddle

Answer 2

第1步：在页面加载中找到li的所有值

  var values;
  $("li").each(function(){
     values.push($(this).text());
  });

第2步：检查td是否包含任何所需事件的值

  $(".table tr").each(function(){
      var val = $(this).text();
      if($.inArray(val,values)){
         // apply style
         $(this).css("background","yellow")
      }
  });

Answer 3

您可以使用：

$('ul li').click(function() {
    $('.table tr td').css('background','none');
    var val = $.trim($(this).text());
    $('.table tr td').filter(function() {
        return $.trim($(this).text()) == val    
    }).css('background','yellow');
});

<强> Fiddle Demo

Answer 4

试试这个：

$elements = $('td, li');
$elements.on('click, mouseover', function () {
    var elem = this;
    $elements.each(function () {
        this.style.backgroundColor = (this !== elem && this.innerHTML === elem.innerHTML && this.tagName !== elem.tagName) ? "green" : "";
    });
});

<强> Working Fiddle

Answer 5

请查看此演示，我相信您期待这个

$（document）.ready（function（）{

$( "#ulList li" ).mouseover(function() {
    var selectedText = $( this ).text();
    $('#tableList tr td').each(function(i, val) {
       if(selectedText == $(val).text()){
          $( val ).css( "background-color", "yellow" );
       }
    });    });
    $( "#ulList li" ).mouseout(function() {
    $('#tableList tr td').each(function(i, val) {
       $( val ).css( "background-color", "white" );

    });    });
 });

Demo

使用jquery突出显示字段

5 个答案: