用jQuery触发div的onmouseover时的未定义函数

Question

我收到未定义的函数错误。 我已经在onmouseover上定义了此函数，但是它不起作用。

我的代码是

的HTML

<div class="col2" onmouseover="show_info('<?php echo $sub_menu['page_id'];  ?>');" onmouseout="hide_info();">
<a href="#">
<img src="css/images/img1.png" />
<h3><?php echo $sub_menu['page_title'];  ?></h3>
</a>
</div>   

脚本

<script>
        function show_info(id)
        {
        alert('hiiii');
        var data = "page_id ="+id;
        $.ajax({
        url:"get_page_info.php", type:"post",data=data,cache:false,
        success: function(html)
            {
            document.getElementById('hide').style.display='none';
            document.getElementById('show').innerHTML=html;
            }
        });
        }

        function hide_info()
        {
            document.getElementById('hide').style.display='block';
            document.getElementById('show').style.display='none';
        }
    </script>

请建议

Answer 1

您在这里有语法错误

url:"get_page_info.php", type:"post",data=data,cache:false,

更改为

url:"get_page_info.php", type:"post",data:data,cache:false,

工作演示

您的data声明"page_id ="+id; 。 您的意思是"page_id="+id; ，或者实际上是var data = {page_id: id};

这是您使用jQuery处理此问题以完全避免该问题的方法。

工作演示

HTML-使用类并将信息存储在数据中。

<div class="col2 showinfo" data-showinfo="123"><h3>456</h3></div> 
<div id="show" style="display:none">show</div>
<div id="hide">hide</div>

因此，在您的PHP中，它将显示为

<div class="col2 showinfo" data-showinfo="<?php echo $sub_menu['page_id']; ?>">

jQuery的

<script>
$(function(){

    $('.showinfo').hover(
        function(){ // first one is mouseover
            var data = {page_id: $(this).data('showinfo')};
            data.html="this is page " + data.page_id; // jsfiddle test
            console.log(data);
            $.ajax({
                url:"/echo/html/", // jsfiddle test
                type:"post",
                data:data,
                cache:false,
                success: function(html){
                    console.log(html);
                   $('#hide').toggle();
                   $('#show').toggle().html(html);
                }
            });            
        }, 
        function(){ // second one is mouseout
            $('#hide, #show').toggle();
        }
   );
});
</script>

Answer 2

在第7行的脚本中有语法错误data=data必须是data:data