JQuery ограничить поиск / если только один div и его дочерние элементы - PullRequest
Новая
       20

JQuery ограничить поиск / если только один div и его дочерние элементы

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

Этот вопрос прост, но настройка немного сложна.Пожалуйста, потерпите меня ...

У меня есть большой список вложенных элементов div, например: 

<div id="ptosTable">

 <div class="elbox hue_vals">
  <a class="symtype1" href="#">
   <div class="sksym">E</div>
  </a>
 </div>

 <div class="elbox hue_domain">
  <a class="symtype1" href="#">
   <div class="sksym">L</div>
  </a>
 </div>

 <!-- ...plus 100 more just like these -->
</div>

Существует также существующий скрипт, который клонирует каждый элемент div ( .elbox *)1007 *) для совершенно другого div ( # pinsets ) при наведении курсора.[См. Ниже.]

Теперь для каждого клона я также хочу добавить класс css в div (только) клона, в зависимости от переменной класса в исходном div.

Примеры

  1. Если исходный div имеет класс hue_vals , к нему следует добавить класс symhue_vals . sksym подразделение клона (только).

  2. То же самое для восьми других вариантов: hue_prod до symhue_prod , hue_found до symhue_found и т. д.

Следующий скрипт почти делает это для hue_vals --- за исключением того, что он выглядит какдля класса hue_vals во всех div, а не только клонируемого: 

$('.elbox').hover(function() {
 $(this).clone().appendTo('#pinsets');

     // next three lines add the new class
 $(this).each(function(i) {
  if($('.hue_vals')){
   $('#pinsets .sksym').addClass('symhue_vals');
  }
 });

 $('#pinsets').show();
}, function() {
 $('#pinsets').hide();
 $('#pinsets').html('');
});

В результате symhue_vals добавляется к каждому клону. sksym div, имеет ли исходный div класс hue_vals или нет.

Итак, я думаю, что мой вопрос (наконец-то!) Таков: как я могу ограничить сценарий поиском hue_whither _only_ в div, который клонируется?

Спасибо!

Ответы [ 2 ]

0 голосов
/ 08 августа 2011 
var $clone;
$('.elbox').hover(function() {
    $clone = $(this).clone();
    var cls = $.trim($clone.attr('class').replace('elbox', ''));
    $('.sksym', $clone).addClass('sym' + cls + '');
    $clone.appendTo('#pinsets');
    $('#pinsets').show();
},
function() {
    $('#pinsets').empty().hide();
});
0 голосов
/ 08 августа 2011

Попробуйте это 

var $clone;
$('.elbox').hover(function() {
  $clone = $(this).clone()
  $clone.appendTo('#pinsets');

     // next three lines add the new class
 $(this).each(function(i) {
  if($('.hue_vals', $clone).length){
     $('#pinsets .sksym').addClass('symhue_vals');
  }
 });

  $('#pinsets').show();

}, function() {

  $('#pinsets').hide().html('');

});
...