jQuery Если текст в div1 совпадает с текстом любой части div2, добавьте класс в div1 - PullRequest
Новая
       12

jQuery Если текст в div1 совпадает с текстом любой части div2, добавьте класс в div1

0 голосов
/ 12 августа 2011

Поскольку я экспериментировал с jQuery всего несколько дней, некоторые вещи (например, массивы) все еще ломают мне голову.Например, при раскрытии функции indexOf возникает ощущение, что вы пытаетесь повернуть направо, когда едете по дороге в Англии.Несмотря на это, я попробовал применить класс, основанный на сравнении одного div с индексом другого ... и (конечно) я не могу заставить его работать.Надеюсь, вы можете сказать мне, если я "тепло" со следующим сценарием.Или, если нет, как это исправить.

Короче говоря: основная идея заключается в том, что если вы наводите курсор мыши на любой .elbox div, скрипт сравнивает текст в .skemps div этого elbox с содержимым вкаждый .pjemp div;и, если он находит совпадение, применяет класс к соответствующему .pjemp div.

Div1: #ptosEmps li div 

<div id="ptosEmps"> 
 <div class="menu">
  <ul id="menu"> 
    <li><div class="pjemp"><a>T</a></div></li>
    <li><div class="pjdesc">T Description</div></li>
    <li><div class="pjemp"><a>I</a></div></li>
    <li><div class="pjdesc">I Description</div></li>
    <!-- ... (one primary li and description li for each of the .skemps letters -->
  </ul>
 </div>
</div>

Div2:#ptosTable .elbox .skemps 

<div id="ptosTable">
 <div class="elbox">
  content
  <div class="skemps">T,I,H,P,W,L,N,F</div>
 </div>
 <!-- About 100 of these. .skemps div can contain one or more of those letters. -->
</div>

Скрипт (не работает): 

$('#ptosEmps li').filter(":even").hover(function() {
    $(this).filter(function() {
    return $('#ptosTable .skemps').text().indexOf($('.pjemp').text()) == -1;
        //if skemps = any text in menu div, return true?
    }).addClass('.emp_hi');
},
function() {
    $(this).removeClass('.emp_hi');
});

Я думаю, может быть, мне нужно как-то определитьвся функция фильтра как $ (this), затем произнесите что-то вроде "$ (this) .addclass ('. emp_hi');"Но как?

----------

Для записи я забыл упомянуть, что текст в Div2 (который вызывает addClass в Div1) также был скрыт через css,Итак, работая по предложению BumbleB2na, это то, чем я закончил ( WORKS! ): 

$('.elbox').hover(function() {
    var arrSkemp = $(this).children('.skemps').text().split(',');
    $.each(arrSkemp, function(index, value) {
        $('.pjemp:contains(' + value + ')').addClass('emp_hi');
    });
},
function() {

    $('.pjemp').removeClass('emp_hi');
});

Props to BumbleB2na - оба за то, что помогли мне разобраться с изломами вмой вопрос и быстрый, очень функциональный ответ, который не сломал мой мозг!

1 Ответ

2 голосов
/ 12 августа 2011

K попробуйте мой jsfiddle , и, возможно, это поможет.Я не мог заставить работать indexOf (), но вот код, с которым я бы пошел: 

$('.skemps').hover(function() {
    var arrSkemp = $(this).text().split(',');
    $.each(arrSkemp, function(index, value) { 
        $('.pjemp:contains(' + value + ')').addClass('emp_hi');
    });
},
function() {
    var arrSkemp = $(this).text().split(',');
        $.each(arrSkemp, function(index, value) { 
            $('.pjemp:contains(' + value + ')').removeClass('emp_hi');
    });
});
...