Получение значения атрибута

У меня есть html, как показано ниже.Получение значения атрибута

<div class="testimonials-list"> 
    <div class="slider testimonials-list-slider" data-index="0"> 
    <div class="testi-list tr-slide"> 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
    </div> 
    <div class="testi-list tr-slide" tr-active data-index="1"> 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
    </div> 
    <div class="testi-list tr-slide" data-index="2"> 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
    </div> 
    </div> 
</div>

Я хочу, чтобы получить активный DIV (т.е. тр-активный класс), а затем хотите получить доступ к значению атрибута 'данных индекса. Как мы можем это сделать с помощью jquery?

var i = $('.testi-list').find('tr-active').attr('data-index');

Невысокая линия не работает.

источник

2017-01-31 ghetal

TR-активный класс не он добавляется в качестве атрибута. Можете ли вы подтвердить это? – Sharmila

1. В вопросе вы пишете 'tr-active' класс, но в разметке это атрибут 2.' .find ('tr-active') 'ищет элемент' ' – Andreas

oops ... tr -active - это класс .... – ghetal

Попробуйте это вы можете сделать это, как $('.testi-list.tr-active').attr('data-index');

$(function(){ 
 

 
var i = $('.tr-active').attr('data-index'); 
 

 
alert(i); 
 
});

\t <div class="testimonials-list"> 
 
    <div class="slider testimonials-list-slider" data-index="0"> 
 
    <div class="testi-list tr-slide"> 
 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
 
    </div> 
 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
    </div> 
 
    <div class="testi-list tr-slide" data-index="2"> 
 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
    </div> 
 
    </div> 
 
</div> 
 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

источник

2017-01-31 10:32:48

$(function(){ 
 

 
var i = $("[tr-active]").attr("data-index"); 
 

 
alert(i); 
 
});

\t <div class="testimonials-list"> 
 
<div class="slider testimonials-list-slider" data-index="0"> 
 
<div class="testi-list tr-slide"> 
 
     <p>As the clock struck midnight on Chaitra Vadi</p> 
 
</div> 
 
<div class="testi-list tr-slide" tr-active data-index="1"> 
 
    <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
</div> 
 
<div class="testi-list tr-slide" data-index="2"> 
 
    <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
</div> 
 
</div> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

источник

2017-01-31 10:35:01

Это будет работать, не изменяя ничего в вашем html (сохраняя «tr-active» как атрибут, а не преобразовывая его в класс) –

ваш HTML должен выглядеть следующим образом ..

<div class="testimonials-list"> 
    <div class="slider testimonials-list-slider" data-index="0"> 
    <div class="testi-list tr-slide"> 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
    </div> 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
    </div> 
    <div class="testi-list tr-slide" data-index="2"> 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
    </div> 
    </div> 
</div>

tr-active Класс был вне кавычек, поэтому он действовал как атрибут.

также использовать это, чтобы найти Data-индексировать

$('.testi-list.tr-active').attr('data-index');

источник

2017-01-31 10:35:57 Minksmnm

Это сделает работу для вас

$('div[tr-active]').data("index")

Demo: https://jsfiddle.net/rhsxfmcL/

источник

2017-01-31 10:36:34

Найдено решение от атрибута данных.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<div class="testimonials-list"> 
 
    <div class="slider testimonials-list-slider" data-index="0"> 
 
    <div class="testi-list tr-slide"> 
 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
 
    </div> 
 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
    </div> 
 
    <div class="testi-list tr-slide" data-index="2"> 
 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
    </div> 
 
    </div> 
 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    <script> 
 
    var i = $('.tr-active').data("index"); 
 
    alert(i); 
 
    </script> 
 
</div> 
 
</body> 
 
</html>

источник

2017-01-31 10:37:26 Ranjith

ответ

Смежные вопросы