鼠标移动到热点上，显示详细信息

鼠标移动到热点上，显示详细信息

1．userController文件

public functionshowDetailAction(){

$userModel=new userModel("localhost","liuyanban","root","123");

      $rows = $userModel->searchAll();

      $this->smarty->assign('list',$rows);

      $this ->smarty->display("showDetail.tpl");

       }

 

    public function processAction(){

      $user_id =$_REQUEST['user_id'];

$userModel=new userModel("localhost","liuyanban","root","123");

       $row = $userModel->getOne($user_id);

      echo json_encode($row);

}

2.userModel文件

public function search($username){

   $sql="select username from user where username='".$username."'";

       //var_dump($sql);

       $result =mysql_query($sql);

       $row =mysql_fetch_assoc($result);

      

       return $row;

       }

public function searchAll(){

  $sql="select * from user";

  $result =mysql_query($sql);

  $rows = array();

  while($row =mysql_fetch_assoc($result)){

    $rows[] =$row;

  }

3.showDetail文件

<table align="center">

<tr>

<th>显示详细信息</th>

</tr>

<{foreach from=$list item="value"}>

<tr style="background-color:#F9F">

<tdid="name_<{$value.user_id}>"><{$value.user_id}></td>

<tdonMouseOver="showDetai(<{$value.user_id}>)"

 onmouseout="hideDetail(<{$value.user_id}>)">

<{$value.username}></td>

</tr>

<{/foreach}>

</table>

<script>

 functionshowDetai(user_id){

    var xhr;

    if(window.ActiveXobject){

         xhr = newActiveXobject("Microsoft.XMLHTTP");

        }else if(window.XMLHttpRequest){

           xhr =new XMLHttpRequest();

           }

           xhr.open("POST","index.php?c=user&a=process",true);

           xhr.onreadystatechange=callback;

           xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

           xhr.send('user_id='+user_id);

           function callback(){

               if(xhr.readyState==4){

                  if(xhr.status==200){

                      var json = eval('('+xhr.responseText+')');

                      var new_div =document.createElement('div');

                      new_div.style.backgroundColor="#ccc";

                      new_div.style.position="absolute";

                      new_div.id="new_div"+user_id;

                      new_div.style.marginLeft='170px';

                      new_div.innerHTML="id:"+json.user_id+"<br/>username:"+json.username+"<br/>loginime:"+json.loginime;

                      document.getElementById('name_'+user_id).appendChild(new_div)

                      }

                  }

               }

    }

    function hideDetail(user_id){

        var new_div =document.getElementById("new_div"+user_id);

        document.getElementById("name_"+user_id).removeChild(new_div);

        }

 

</script>