Блог

Главная - Вопросы по программированию - Используйте jQuery для динамического изменения значений класса на основе значений полей

Используйте jQuery для динамического изменения значений класса на основе значений полей

#jquery

#jquery

Вопрос:

Вот различные части моего кода

часть 1

 <ul class="tabs">
  <li><a class="tab1" href=""></a></li>
  <li><a class="tab2" href=""></a></li>
  <li><a class="tab3" href=""></a></li>
  ...
</ul>

и часть2

 <div class="field-items">
  <div class="field-item">tab1</div>
  <div class="field-item">tab3</div>
  ...
</div>

Как создать условие, чтобы, если в части 2 оно имело значения «tab1» и «tab3», то часть 1 была изменена, чтобы содержать эти классы:

 <li class="hiden"><a class="tab1" href=""></a></li>
...
<li class="hiden"><a class="tab3" href=""></a></li>
...

Ответ №1:

Что-то подобное должно сработать для вас:

 $(document).ready(function(){
    $("div.field-items div.field-item").each(function(){
       $("."   $(this).html()).parent().addClass("hiden");
    }); 
});

Комментарии:

1. Спасибо. И как сделать, если такая связь?<li><a class=»tab1″ href=»»>111</a></li> и часть2 <div class=»field-item»>111</div>

2. Не могли бы вы исправить это .jQuery(document).ready(function($){ $('.field-item').each(function() { var tabname = $(this).text(); if(tabname == 'tab1' || tabname == 'tab3') { $('.tabs li a').hasClass(tabname).parent().addClass("hiden"); } }); }) .

3. @Siteogra: Это можно легко сделать, добавив селектор :econtains в jQuery. Я привел пример разветвления вашего последнего jsfiddle: jsfiddle.net/5RzxN/1 Наслаждайтесь 🙂

Ответ №2:

Вероятно, что-то вроде этого:

 $('.field-item').each(function()
{
    $('.'   this.innerHTML).addClass('hiden');
});

Возможно, небольшая модификация, но она должна сработать.