Question

菜单通过ajax加载，悬停功能使用live（）与每个li相关联。但它仍然没有第一次触发。从第二次起，它正在触发

主要文件

<html>
     <head>
        <title>
            test
        </title>
        <script type='text/javascript' src='js/jquery-1.4.2.js'>
        </script>
        <script>
            $(window).load(function() {
                jQuery(document).ready(function() {
                    jQuery('.loadm').live('click', function(event) {
                        $.ajax({
                            type: "POST",
                            url: "loadmenu.php",
                            success: function(data) {
                                $('#menu').html(data);
                            },
                            error: function() {

                            }
                        });
                    });
                    jQuery('.addchar').live('hover', function(event) {
                        $('.addchar:visible').each(function(index) {
                            $(this).hover(function() {
                                $("#result").html("Index is: " + index);
                            });
                        });
                    });
                });
            });
        </script>
    </head>

    <body>
        <div id="content">
            <form method="post">
                <a href="#" class="loadm">Load Menu</a>
            </form>
            <div id="menu" style="width:100">
                none
            </div>
            <div id="result">
            </div>
        </div>
    </body>

</html>

菜单文件

<?php
echo "<ul><li class='addchar'>one </li>
          <li class='addchar'>two </li>
          <li class='addchar' style='display:none'> three</li>
          <li class='addchar'>four </li>
          <li class='addchar' style='display:none'> five</li>
          <li class='addchar'>six </li>
          <li class='addchar' style='display:none'> seven</li>
          <li class='addchar'> eight</li>
          <li class='addchar' style='display:none'> nine</li>
                </ul>";

＆GT;

Answer 1

摆脱现场并追求成功的行动

jQuery(document).ready(function() {
    jQuery('.loadm').live('click', function(event) {
        $.ajax({
            // remove the line below and restore your url
            data: "html=" + $('#menufromajax').html() + '&delay=1',
            type: "POST",
            url: "/echo/html/",
            success: function(data) {
                $('#menu').html(data);


                $('.addchar:visible').each(function(index) {
                    $(this).hover(function() {
                        $("#result").html("Index is: " + index);
                    });

                });


            },
            error: function() {

            }
        });
    });
});

http://jsfiddle.net/ENEBB/3/

即使有延迟也能正常工作。

但严重的是，不需要$（window）.load和jQuery（document）.ready，如果你在noconflict模式下运行，你可以只做$（function（）或jQuery（document）.ready

不要使用'＆lt;脚本＆gt;'总是通过添加type ='text / javascript'

来定义类型

第一次盘旋时不会触发jquery hover（）

1 个答案: