无法获取父级父级的jquery data（）。仅返回undefined

Question

列表：

<ul class="div_chart1" data-quickcode="mac" data-questionid="1" >
    <li>
       <img src="inmark/pie_icon.jpg" class="pie_icon" onclick="ok()"/>
    </li>
</ul>

功能：

function ok(){          
    console.log($(this).parent().parent().data('quickcode'));
    console.log($(this).parent().parent().data('questionid'));  
}

function ok（）返回undefined。这有什么问题？

Answer 1

尝试将this引用作为参数传递给内联处理程序

HTML：

<img src="inmark/pie_icon.jpg" class="pie_icon" onclick="ok(this)"/>

JS：

function ok(elem){          
    console.log($(elem).closest('ul').data('quickcode'));
    console.log($(elem).closest('ul').data('questionid'));  
}

DEMO

---

最好的方法是，

$('.pie_icon').click(function(e){
  e.stopPropagation();
  var parent = $(this).closest('ul');
  console.log(parent.data('quickcode'));
  console.log(parent.data('questionid'));  
});

Answer 2

您的上下文中的

this指的是全局窗口对象。

console.log(this); // Window {top: Window, window: Window, location: Location, external: Object, chrome: Object…}

因此传递元素对象，

<img src="inmark/pie_icon.jpg" class="pie_icon" onclick="ok(this)"/>  


function ok(element) {
    console.log($(element).parent().parent().data('quickcode'));
    console.log($(element).parent().parent().data('questionid'));
} // here is element is HTML element object. Just wrap it with jQuery to use jQuery function.

More about inline event handlers