Question

我试图在链接点击时使用jquery获取数据位置值。这是我的代码

<div class="dfd-article-tile-wrapper tile-position-6">
<div id="f_54ae4352d493b83429617a69" data-position="5" class="dfd-item tile">
<a class="dfd-item-wrap cxense" target="_blank" href="#">
    <div class="imageholder">
        <img src="#" alt="Depresjon - en oversikt " style="background-image: url(image.png);">

        <div class="shader" style="">
            <h2 class="dfd-tile-header">Hello World </h2>
            <span class="source">xyz.com</span>
        </div>
    </div>
</a>
</div>
                    </div>

到目前为止，我已经尝试过编写这个jquery代码，但是它没有用;

 <script type="text/javascript"> 
     jQuery(document).ready(function($) {
         $(".dfd-item-wrap").click(function(event) {   
             var text = $(this).parents(".dfd-item").find('data-position').value    
         alert(text);
     });
 });
 </script>

这是jsfiddle链接 http://jsfiddle.net/nt7243s6/

需要帮助和指导。谢谢

Answer 1

您需要使用.data()代替.find()来获取数据属性值。也可以使用.closest(.dfd-item)或.parent()代替.parents()：

var text = $(this).closest(".dfd-item").data('position');

完整代码：

$(".dfd-item-wrap").click(function(event) {  
  event.preventDefault();
  var text = $(this).closest(".dfd-item").data('position');    
  alert(text);
});

Working Demo

Answer 2

您应该通过data('position');

访问data属性的方式

http://jsfiddle.net/nt7243s6/2/

在链接点击时从父div获取数据位置值

2 个答案:

Working Demo