jquery - 试图在 mouseenter 上的 div 下方获取 href 属性值

Question

data-name当我将鼠标悬停在<div class="hover_over">

<div class="hover_over">

    <a href="somelink">some value</a>

    <div class="menu_info1">
    <div class="menu_info2"></div>


    <div class="user_menu popover">
        <div class="user_menu_nipple"></div>
        <div class="user_menu_list"></div>

      <a href="someotherlink" class="targetclass" data-name = "What_I_Need" >           
            </a>
     </div> ...
</div>

用于获取“ somelink this.href”，但一直试图向下寻找。

这是我得到“somelink”的方式：

$(".hover_over").mouseenter(

function () {

localStorage['ls1'] = this.href;  
localStorage['ls2'] = this.href.slice(7).split(".")[0];  

... some other stuff

}

Answer 1

本质上...

$(".hover_over").mouseenter( function(){
    // If target is a direct descendent:
    var $data_name = $(this).children(".targetclass").data("name");

    // If target is within other child(ren):
    var $data_name = $(this).find(".targetclass").data("name");

    // do something else with $data_name
    console.log( $data_name );
});

Answer 2

鉴于您在帖子中提供给我们的 html，这里是一个工作小提琴http://jsfiddle.net/jasenhk/zwdFc/。

本质上...

$(".targetclass").mouseenter(function(e) {
    var data = $(this).data("name");
    console.log(data);
});

需要注意的一些事项：

1. 您的 html 未指定hover_over该类的元素。这使得其他人很难复制您的问题。
2. 在您的mouseenter处理程序中，this可能不是您认为的那样——检查它的值。

编辑感谢您的提琴。您需要使用搜索.find来遍历您的目标元素。

$(".hoverclass").mouseenter(function(e) {
    var data = $(this).find(".targetclass").data("log-name");
    console.log(data);

    $("#result").html("the result is:" + data);
});

Answer 3

您是否尝试过类似的方法：

$(".targetclass").hover(function(){
    var data = $(this).attr("data-name");
 }, function(){});