Javascript 正确的jQuery结构，该函数应该在DOM就绪状态下以及在整个浏览会话中运行

我的网站包含单选按钮和复选框

当用户在表单中选择一个并提交表单时，将存储此状态，这样当用户返回页面时，将按照用户以前的选择加载该状态

这些复选框中的一些具有子元素，当选中它们的父元素时，这些子元素会改变它们的disabled属性，以便与它们交互

我使用jQuery函数来实现这一点

如果用户以前选择了禁用子元素的父元素，那么当它们返回页面时，我需要一个函数来启用子元素运行

我还需要在每次用户在浏览会话中选择一个时运行此功能

我目前可以通过复制jQuery函数来实现这一点，一次是在一个When-DOM-Ready封装中，一次是在没有这个封装的情况下

我怀疑这是一种不好的做法，对吗？如果是，我该怎么做

为了说明我的观点，以下是一个例子：

//First the code for DOM ready:
//You can see it disables and unchecks boxes if they are not checked etc.

$(function() {
    if ($('#parent').is(':checked')) {
            $('#child1').removeAttr('disabled');
            $('#child2').removeAttr('disabled');
    } else {
            $('#child1').attr('disabled', true);
            $('#child1').removeAttr('checked');
            $('#child2').attr('disabled', true);
            $('#child2').removeAttr('checked');
    }  

 });

//Now, the exact same function just without the DOM ready encapsulation.

if ($('#parent').is(':checked')) {
            $('#child1').removeAttr('disabled');
            $('#child2').removeAttr('disabled');
    } else {
            $('#child1').attr('disabled', true);
            $('#child1').removeAttr('checked');
            $('#child2').attr('disabled', true);
            $('#child2').removeAttr('checked');
    }  

---

谢谢您的建议。

那么基本上您希望页面的状态保持不变

您可以将状态存储在多个位置：

客户端存储

饼干

URL散列

饼干可能是最简单的

要正确地保持状态，必须跟踪实际状态。 因此，每当DOM的状态发生变化时，存储该变化。然后，当用户打开页面时，查看cookie并恢复状态（这是DOM就绪部分）

这并不总是一件容易的事情，因为状态可能非常复杂。假设您有一个某种可折叠的树，您需要跟踪哪些节点被扩展

---

如果您只是想跟踪一些复选框，那应该不会太难。

是的，像这样重复代码是不好的做法。因此，如果您的代码做了它应该做的事情，您可以像下面那样编写它

我相信您使用的CMS在Ajax框架中执行一些表单Ajax任务，对吗？（例如Drupal？）否则我无法想象为什么这段代码会像您描述的那样

(function($) { 
    var init = function() {
            if ($('#parent').is(':checked')) {
                $('#child1').removeAttr('disabled');
                $('#child2').removeAttr('disabled');
            } else {
                $('#child1').attr('disabled', true);
                $('#child1').removeAttr('checked');
                $('#child2').attr('disabled', true);
                $('#child2').removeAttr('checked');
            }  
        }

    //first call
    init();

    //second call
    $(function() {
        init();
    });

})(jQuery);

---

这是多余的。我认为您对绑定的内容有误解。准备好了吗！嗯，这很奇怪——因为我的经验并没有证明这一点：如果我只有一个未准备好DOM的，那么当页面加载时，它不会改变输入的属性。只有当用户与之交互时。同样，如果我只有一个是DOM就绪的，它会在页面加载时改变，但不会在用户单击它时改变。在示例代码中没有

单击

事件绑定。如果那样的话，我的问题就不同了对不起，你误解了。我使用存储的变量（客户端存储、MySQL等）将其设置为使状态保持不变。这一点，是我需要改变默认的“禁用”状态的一些输入元素都在页面加载。。。如果用户在浏览会话中单击了某个内容。存储状态不是我的问题。

element.setAttribute（“禁用”，false）？如果这是你问题的答案，那么你应该学会使你的问题更加简洁和中肯。好吧，我可以成功地禁用元素，或者根据父元素的状态启用它。这不是问题所在。我需要做两次：1）当页面加载时（如果以前存储的状态需要），2）当用户在浏览时单击父元素时。上面的每个代码块似乎都做了其中一件事，但唯一的区别是封装。我只是想澄清一下——我的系统的工作原理与我所希望的完全一样，但我怀疑这是一种不好的做法。好吧，@FritsvanCampen，这并不是我所能说的，答案（尽管你没有解释答案——你是不是建议我用这个函数代替我的？这并不能解决我的问题），但是，我将澄清我的操作，因为我没有理解如果你想在两个不同的事件中运行一些代码，就把它放在一个函数中，并从两个事件调用该函数？我真的在猜你的问题是什么。那么，状态持久性与此无关吗？重复代码总是一个问题。