如何使用onmouseout清除mouseenter上显示的数据

How do I clear data shown on mouseenter with onmouseout

本文关键字：显示 数据 mouseenter 何使用 onmouseout 清除      更新时间：2023-09-26

当用户悬停在一个图像上时，会出现一个关于该图像的信息框，当我移动到另一个图像时，它们在框内的信息会发生变化，但当我没有图像时，信息框会保留。我无法关闭信息框（即工具提示）。

JS:

var id;
$(document).ready(function () {
    $('a').mouseenter(function () {
        //var id = $(this).parent().attr('myval');
        id = $(this).data('myval');
        $.ajax({//create an ajax request to foliobase.php
            type: "GET",
            //link to the foliobase.php file "?subj" here is the connector
            url: "foliobase.php?subj=" + id,
            dataType: "html",
            success: function (response) {
                $("#fillFolio").html(response);
            }
        });
    });
    $('a').onmouseleave(function () {
        id  = $(this).data.display = 'none';
    }
});

我怎样才能让信息框在鼠标上消失？我已经尝试了多个测试，但框中甚至没有出现它们，我尝试的最后一个测试在上面的代码中。

    $('a').onmouseleave(function () {
        id  = $(this).data.display = 'none';
    }

我在去年才开始使用javascript、jquery等。

提前感谢！！

这是php。

<div class="thumbnails">
<?php
$query = mysqli_query($connection, "select * from portfolio");
    print "<ul>";
    while ($row = mysqli_fetch_assoc($query)) {print "<li><a href='"javascript:return(0)'" data-myval=".$row['folio_id'] . "><img onClick=preview.src=" . $row['image'] . "name=" . $row['folio_id'] . "src={$row['image']}></a></td></li>";
    }
    print "</ul>";
    ?>
</div>
<!--Folio Information-->
<div id="fillFolio">Project Information</div>

我不确定，但尝试使用：

$('a').onmouseleave(function () {
    $("#fillFolio").empty();
}

希望这能有所帮助。

$("a").hover(function(){
       id = $(this).data('myval');
        $.ajax({//create an ajax request to foliobase.php
            type: "GET",
            //link to the foliobase.php file "?subj" here is the connector
            url: "foliobase.php?subj=" + id,
            dataType: "html",
            success: function (response) {
                $("#fillFolio").html(response);
            }
        });
    }, function(){
//im not sure u want to hide or want to just clear your question not clear
    $("#fillFolio").empty();
    $("#fillFolio").hide();
});

为什么不使用jQuery hover=（mouseenter+mouseleave）

<script type="text/javascript">
   var id;
   $(document).ready(function () {
    $('a').hover(function () {
        //var id = $(this).parent().attr('myval');
        id = $(this).data('myval');
        $.ajax({//create an ajax request to foliobase.php
            type: "GET",
            //link to the foliobase.php file "?subj" here is the connector
            url: "foliobase.php?subj=" + id,
            dataType: "html",
            success: function (response) {
                $("#fillFolio").html(response);
            }
        });
       ,function () {
          id  = $(this).empty();
    });
</script>
相关文章：