0

我正在创建一个 Cakephp 应用程序。我的问题是我的 Jquery 在我第一次加载页面时运行良好。我的意思是当页面打开或第一次调用控制器操作时。但是当我尝试使用 ajax 渲染视图时。虽然视图渲染成功，但类和 ID 不是由 Jquery 操作的。我的意思是我的 jquery 不起作用。如果我通过 Ajax 渲染任何视图。

虽然我发现在渲染视图上使用相同的技巧。但我不认为这是一个好方法。因为我写了很多特殊的布局，我把所有的都结合在了特殊的布局之上。不可能将它分开并为特定视图编写它。

帮助我为什么在我的类 id 都相同的情况下渲染视图失败。？

示例代码..BUt 如果我的任何元素重新加载，它会通过 ID 或 CLASS MY JQUERY 失败。

   jQuery(document).ready(function(){
    //Sidebar Accordion Menu:
    jQuery("#main-nav li ul").hide(); // Hide all sub menus
    jQuery("#main-nav li a.current").parent().find("ul").slideToggle("slow"); // Slide down the current menu item's sub menu
    jQuery("#main-nav li a.nav-top-item").click( // When a top menu item is clicked...
    function () {
        jQuery(this).parent().siblings().find("ul").slideUp("normal"); // Slide up all sub menus except the one clicked
        jQuery(this).next().slideToggle("normal"); // Slide down the clicked sub menu
        return false;
    }
);
    jQuery("#main-nav li a.no-submenu").click( // When a menu item with no sub menu is clicked...
    function () {
        window.location.href=(this.href); // Just open the link instead of a sub menu
        return false;
    }
);
    // Sidebar Accordion Menu Hover Effect:
    jQuery("#main-nav li .nav-top-item").hover(
    function () {
        jQuery(this).stop().animate({ paddingRight: "25px" }, 200);
    },
    function () {
        jQuery(this).stop().animate({ paddingRight: "15px" });
    }
);


    //Close button:
    jQuery(".close").click(
    function () {
      jQuery(this).parent().fadeTo(400, 0, function () { // Links with the class "close" will close parent
            jQuery(this).slideUp(400);
        });
        return false;
    }
);

});
4

1 回答 1

1

像素主义是对的。在 ajax 请求的回调中，您需要执行 javascript 以将事件附加到已在 AJAX 请求中加载的新 DOM 元素。

还有一些方法可以将事件附加到现在或将来存在的 DOM 元素，这意味着您可以执行一次 Javascript（在窗口加载时），甚至可以在通过 AJAX 加载的新 DOM 元素上运行。

请参阅 jQuery 的 'live' 方法：http ://api.jquery.com/live/请注意，此方法实际上在 jQuery 1.7 中已弃用，但新的 'on' 方法 (http://api.jquery.com/on/ ) 如果你以正确的方式调用它，应该能够做同样的事情。

另请参阅本文以获得对不同类型事件绑定的良好解释：http ://www.alfajango.com/blog/the-difference-between-jquerys-bind-live-and-delegate/ 同样，其中描述的方法文章已被弃用，取而代之的是新的“on”方法，但这些解释在决定如何使用“on”方法时应该仍然有用。

希望有帮助！

PS - 如果您仍然无法粘贴一些代码。

编辑：

我看过你的代码。我不会为您重写所有内容，但为了给您一个想法，您将替换此块：

jQuery("#main-nav li a.no-submenu").click( // When a menu item with no sub menu is clicked...
    function () {
        window.location.href=(this.href); // Just open the link instead of a sub menu
        return false;
    }
);

像这样：

jQuery(document).on('click', "#main-nav li a.no-submenu", function () {
        window.location.href=(this.href); // Just open the link instead of a sub menu
        return false;
});

顺便说一句，我还没有测试过那个代码，但它应该给你一些可以使用的东西。

这里有新的“on”方法的进一步解释：http: //blog.jquery.com/2011/09/28/jquery-1-7-beta-1-released/

于 2012-06-23T23:14:01.663 回答