0

我有一个 JQuery / Javascript 函数,可在我的网站上用于一些基本的 UI 功能。但是,该函数影响的许多元素将通过 Ajax 注入,而其他元素将是静态 html。

目前,通过复制函数并同时应用 $(document).ready 和 $(document).ajaxSucces,我已经能够使我的脚本为我工作。

我的问题是:什么是适当的完成这个?

这是我的 JS:

    $(document).ready(function () {
        $(".hidesfieldset:not(:first)").hide();
        $("fieldset").bind("focus click",function () {
            $(".hidesfieldset:not(:parent)").hide(800);
            $(".hidesfieldset", this).slideDown(800);

        });

    });

     $(document).ajaxSuccess(function () {
        $(".hidesfieldset:not(:first)").hide();
        $("fieldset").bind("focus click",function () {
            $(".hidesfieldset:not(:parent)").hide(800);
            $(".hidesfieldset", this).slideDown(800);

        });

    });

因为我的一些表单是通过 ajax 注入的,所以第一个函数没有应用于它们,所以我还必须包含 ajax Success。

注意*:当谈到 JS 时,我是一个完全的新手,这是我第一次使用它,可能有点过头了。因此,如果您在其中看到其他错误的内容,请随时发表评论。

谢谢,马克

4

1 回答 1

1

当您通过 ajax 将对象异步添加到页面并希望将事件处理程序连接到其中一些新添加的对象时,您有以下选项:

  1. 您可以通过将委托事件处理程序分配给页面最初加载时页面中存在的静态父对象来使用委托事件处理。

  2. 您可以将事件处理程序添加到在将对象添加到页面后添加它们的 ajax 调用的成功处理程序中动态添加的对象。

  3. 您可以在所有 ajax 调用之后检查页面中的新对象(这有点像 hack,但听起来像您正在做的事情)。您必须非常小心,不要将重复的事件处理程序添加到在此 ajax 调用之前已经存在的对象中。

如果您的页面 HTML 和类的结构是为其设计的,那么委托事件处理通常是处理此问题的最简单方法。以下是一些先前的答案,描述了如何使用委托事件处理:

jQuery .live() 与 .on() 方法在加载动态 html 后添加点击事件

JQuery 事件处理程序 - 什么是“最佳”方法

jQuery.on() 是否适用于在创建事件处理程序后添加的元素?

于 2013-09-18T17:05:30.303 回答