首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >JavaScript "this“不适用于HTML元素

JavaScript "this“不适用于HTML元素
EN

Stack Overflow用户
提问于 2019-02-05 12:38:52
回答 1查看 95关注 0票数 0

我想用通过php访问数据库的img元素在div中显示信息。我将onmouseover event与每个元素关联,并将this和一些参数作为参数传递,但当我将鼠标悬停在图像上时,div显示在浏览器的左上角,而不显示在图像旁边。

我也尝试过remove this,结果还是老的。

图像元素的代码

代码语言:javascript
复制
         $row = mysqli_fetch_array($result);

          $firstname = $row['firstname'];

          $lastname = $row['lastname'];

          $image =    $row['image'];

          $phone =    $row['phone'];

          $email =    $row['email'];

     $realtorData = $firstname.'|'.$lastname.'|'.$phone.'|'.$email.'|';
echo "<img src='/../../Realtors/$image'onmouseover='showRealtorInfo(this,\"".$realtorData."\" );' onmouseout='hideRealtorInfo();'>";

javaScript代码

代码语言:javascript
复制
  function showRealtorInfo(element, realtorInfo)
{
    var realtorArray = realtorInfo.split('|');

    var firstname = realtorArray[0];
    var lastname  = realtorArray[1];
    var phone     = realtorArray[2];
    var email     = realtorArray[3];

    var realtorInfoDiv = document.getElementById('realtorinfo');

    var myHTML  = "<p><b>" + firstname + " " + lastname + "</b><br /><br />";
        myHTML += "Phone: " + phone + "<br />";
        myHTML += "Email: " + email + "<br />";

    realtorInfoDiv.innerHTML = myHTML;

    x = element.offsetLeft;
    y = element.offsetTop;

    //alert(x);

    realtorInfoDiv.style.left = y + 100;
    realtorInfoDiv.style.top = x + 550;



    realtorInfoDiv.style.visibility = 'visible';


}

div元素的css代码

代码语言:javascript
复制
#realtorinfo{

position: absolute;
left: 10px;
top: 10px;
width: 200px;
height: 150px;
padding: 5px;
background-color: yellow;
visibility: hidden;
float: left;

} 
EN

回答 1

Stack Overflow用户

发布于 2019-02-05 13:32:40

您在下面的LOC中没有提到"px“。

代码语言:javascript
复制
realtorInfoDiv.style.left = y + 100;
realtorInfoDiv.style.top = x + 550;

这应该是可行的:

代码语言:javascript
复制
realtorInfoDiv.style.left = y + 100 + "px";
realtorInfoDiv.style.top = x + 550 + "px";
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54527740

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档