Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.10.2017, 19:36
Интересующийся
Отправить личное сообщение для aston Посмотреть профиль Найти все сообщения от aston
 
Регистрация: 03.09.2017
Сообщений: 12

Удаление класса через find js/jq
Доброго времени суток друзья! Есть функция позволяющая отлавливать правый клик мыши по элементу, она берет элемент по которому был осуществлен клик, находит в следующем после него контейнер span и с помощью внутренней функции find ищет div с классом hadden_menu_dao
и меняет его на hadden_menu_dao_show.

Вопрос: как заставить интерпретатор заменить класс у блока найденного с помощью find? т.к. в примере при замене класса в консоль приходит undefined.

$(function() {
    $("ul").on("contextmenu", "a.a", function(event) {
        event.preventDefault();

                  // получаем текущий элемент по которому был проезведен клик
                  var target = event.target;
                  // console.log(target);
                  var link_html = target.innerHTML;
                  // ищем div с классом у рядом стоящего элемента
                  var asd = $(this).next('.redact').find($(".hadden_menu_dao"));
                  // console.log(asd);


        // осуществляем проверку на наличие класса (заменяем класс при его наличии)
        if($('div').is('.hadden_menu_dao_show')) {
              var articles = document.getElementsByClassName('hadden_menu_dao_show');
              articles.classList.remove("hadden_menu_dao_show");
              articles.classList.add("hadden_menu_dao");
        };



  // удаление класса "hadden_menu_dao"
  asd.classList.remove("hadden_menu_dao");

  // добавление элементу класс "hadden_menu_dao_show"
  asd.classList.add("hadden_menu_dao_show");
    

          return false;
    })
});


<ul id="id" class="display_set">
   <li>
      <a href="№" title="№" class="a">link1</a>
      <span class="redact" id="1">
         <div class="hadden_menu_dao">
            
         </div>
      </span>
   </li>
   <li>
      <a href="№" title="№" class="a">link2</a>
      <span class="redact" id="2">
         <div class="hadden_menu_dao">
            
         </div>
      </span>
   </li>
   <li>
      <a href="№" title="№" class="a">link3</a>
      <span class="redact" id="3">
         <div class="hadden_menu_dao">
            
         </div>
      </span>
   </li>
   <li>
      <a href="№" title="№" class="a">link4</a>
      <span class="redact" id="4">
         <div class="hadden_menu_dao">
            
         </div>
      </span>
   </li>
</ul>

Последний раз редактировалось aston, 04.10.2017 в 20:02.
Ответить с цитированием
  #2 (permalink)  
Старый 04.10.2017, 20:21
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aston,
для данной структуры достаточно менять класс только у самой ссылки и у обьектов jquery нет метода classList
Ответить с цитированием
  #3 (permalink)  
Старый 04.10.2017, 20:23
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aston,
у getElementsByClassName тоже нет метода classList!!!
Ответить с цитированием
  #4 (permalink)  
Старый 04.10.2017, 20:29
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aston,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .hadden_menu_dao {
     display: none;
  }
  a.open + .redact .hadden_menu_dao {
     display: block;
  }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
   $("ul").on("contextmenu", "a.a", function(event) {
        event.preventDefault();
        $(this).addClass("open")
     })
});
  </script>
</head>

<body>
<ul id="id" class="display_set">
  <li>
    <a href="№" title="№" class="a">link1</a>
    <span class="redact" id="1">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link2</a>
    <span class="redact" id="2">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link3</a>
    <span class="redact" id="3">
      <div class="hadden_menu_dao">
              всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link4</a>
    <span class="redact" id="4">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
</ul>

</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 04.10.2017, 23:07
Интересующийся
Отправить личное сообщение для aston Посмотреть профиль Найти все сообщения от aston
 
Регистрация: 03.09.2017
Сообщений: 12

Спасибо Рони! Подскажи пожалуйста, как проверить на существование селектора с определенным классом и если результат true заменить его.

пробовал так:

function function_dffg () {
            if($("div").hasClass("hadden_menu_dao_show")) {

                  var argument = $("div").hasClass("hadden_menu_dao_show");
                  console.log(argument);
                  argument.classList.remove('hadden_menu_dao');
                  argument.classList.add('hadden_menu_dao_show');
            };
        };



        function_dffg();


не получается
Ответить с цитированием
  #6 (permalink)  
Старый 05.10.2017, 00:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aston,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .hadden_menu_dao {
     display: none;
  }
  .hadden_menu_dao_show {
     display: block;
  }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
   $("ul").on("contextmenu", "a.a", function(event) {
        event.preventDefault();
        var asd = $(this).next('.redact').children();

       //if(asd.is(".hadden_menu_dao"))  {asd.addClass("hadden_menu_dao_show").removeClass("hadden_menu_dao"); }

        asd.toggleClass("hadden_menu_dao hadden_menu_dao_show");

     })
});
  </script>
</head>

<body>
<ul id="id" class="display_set">
  <li>
    <a href="№" title="№" class="a">link1</a>
    <span class="redact" id="1">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link2</a>
    <span class="redact" id="2">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link3</a>
    <span class="redact" id="3">
      <div class="hadden_menu_dao">
              всякая фигня
      </div>
    </span>
  </li>
  <li>
    <a href="№" title="№" class="a">link4</a>
    <span class="redact" id="4">
      <div class="hadden_menu_dao">
             всякая фигня
      </div>
    </span>
  </li>
</ul>

</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 05.10.2017, 13:18
Интересующийся
Отправить личное сообщение для aston Посмотреть профиль Найти все сообщения от aston
 
Регистрация: 03.09.2017
Сообщений: 12

Рони, дело в том, что мне надо заменеть класс у ранее открытого блока при нажатии правой кнопкой мыши на другую ссылку. Я ни как не могу получить еще один объект на подобие того, что приходит в функцию как asd/this.
if(asd.is(".hadden_menu_dao_show")) {
          asd.addClass("hadden_menu_dao").removeClass("hadden_menu_dao_show"); 
      }

в представленной функции, проверка идет непосредственно у элемента пришедшего по событию rightclick, возможно ли получить объект с уже открытым блоком и заменить там класс.

Последний раз редактировалось aston, 05.10.2017 в 13:24.
Ответить с цитированием
  #8 (permalink)  
Старый 05.10.2017, 13:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aston,
не понимаю, сделайте выборку всех отрытых блоков $(".hadden_menu_dao_show") и делайте что хотите.
Ответить с цитированием
  #9 (permalink)  
Старый 05.10.2017, 13:37
Интересующийся
Отправить личное сообщение для aston Посмотреть профиль Найти все сообщения от aston
 
Регистрация: 03.09.2017
Сообщений: 12

Разобрался, делаю так:
$(function() {
   $("ul").on("contextmenu", "a.a", function(event) {
        event.preventDefault();

                  // получаем текущий элемент по которому был проезведен клик
                  var target = event.target;
                  // console.log(target);
                  var link_html = target.innerHTML;
                  // ищем div с классом у рядом стоящего элемента
                  var asd = $(this).next('.redact').find($(".hadden_menu_dao"));
                  // console.log(asd);

      if($("div").is(".hadden_menu_dao_show")) {
          $("div.hadden_menu_dao_show").removeClass("hadden_menu_dao_show").addClass("hadden_menu_dao"); 
      }

      
        asd.toggleClass("hadden_menu_dao hadden_menu_dao_show");
        // asd.removeClass("hadden_menu_dao");
        // asd.addClass("hadden_menu_dao_show");

      if (document.getElementById('daoX2')) {
          document.getElementById('daoX2').removeAttribute('id');
      };

      $(this).attr('id','daoX2');

      return false;
     })
});

Рони, спасибо вам огромное!
Ответить с цитированием
  #10 (permalink)  
Старый 05.10.2017, 13:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от aston
делаю так:
ужас, но раз этот венигрет делает то что вам нужно, то ок!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Добавление, изменение, удаление данных через JS Арсений JustPuk Общие вопросы Javascript 2 27.04.2015 09:46
Значение переменной через запятую DDSSDD Серверные языки и технологии 41 16.10.2014 15:01
удаление класса через несколько секунд jule Общие вопросы Javascript 2 09.10.2013 15:52
Удаление элементов через splice. возможно ли оптимизировать? Storan Общие вопросы Javascript 0 01.10.2011 21:16
Свойства/методы класса TicTac Общие вопросы Javascript 5 03.07.2011 14:53