Обнаружить изменение класса внутри div с помощью слушателя jquery - PullRequest
0 голосов
/ 27 декабря 2018

Это мой код по умолчанию.Я хочу добавить слушателя к .variations_div > .select-items > div.В основном мой выбор заменен на div.Я хотел использовать select onchange, но сейчас он не работает.Это мой оригинальный HTML.

<div class="custom-select variations_div">
   <select>
      <option value="">- Select Variation -</option>
      <option value="9298">EXT SOCKET 1/2 X 1/2 X 10MM</option>
      <option value="9299">EXT SOCKET 1/2 X 1/2 X 15MM</option>
      <option value="9300">EXT SOCKET 1/2 X 1/2 X 20MM</option>
      <option value="9301">EXT SOCKET 1/2 X 1/2 X 25MM</option>
   </select>
   <div class="select-selected">- Select Variation -</div>
   <div class="select-items select-hide">
      <div>- Select Variation -</div>
      <div>EXT SOCKET 1/2 X 1/2 X 10MM</div>
      <div>EXT SOCKET 1/2 X 1/2 X 15MM</div>
      <div>EXT SOCKET 1/2 X 1/2 X 20MM</div>
      <div>EXT SOCKET 1/2 X 1/2 X 25MM</div>
   </div>
</div>

В основном, когда я меняю выбор, он добавляет класс same-as-selected в div.Я хочу, чтобы слушатель извлек html этого конкретного div и дал его мне.

<div class="custom-select variations_div">
   <select>
      <option value="">- Select Variation -</option>
      <option value="9298">EXT SOCKET 1/2 X 1/2 X 10MM</option>
      <option value="9299">EXT SOCKET 1/2 X 1/2 X 15MM</option>
      <option value="9300">EXT SOCKET 1/2 X 1/2 X 20MM</option>
      <option value="9301">EXT SOCKET 1/2 X 1/2 X 25MM</option>
   </select>
   <div class="select-selected">EXT SOCKET 1/2 X 1/2 X 15MM</div>
   <div class="select-items select-hide">
      <div>- Select Variation -</div>
      <div>EXT SOCKET 1/2 X 1/2 X 10MM</div>
      <div class="same-as-selected">EXT SOCKET 1/2 X 1/2 X 15MM</div>
      <div>EXT SOCKET 1/2 X 1/2 X 20MM</div>
      <div>EXT SOCKET 1/2 X 1/2 X 25MM</div>
   </div>
</div>

Это мой текущий код.

$(".variations_div > .select-items > div").attrchange({
    trackValues: true, // set to true so that the event object is updated with old & new values
    callback: function(evnt) {
        alert(1);
        if(evnt.attributeName == "class") { // which attribute you want to watch for changes
            if(evnt.newValue.search(/open/i) == -1) { // "open" is the class name you search for inside "class" attribute

                // your code to execute goes here...
            }
        }
    }

Но это не работает.

1 Ответ

0 голосов
/ 27 декабря 2018

change работает здесь: JSFiddle

...