Question

我有以下代码在页面加载时设置一些自定义表单元素，然后在用户点击它们时更新它们：

// Setup Function
$(function () {
    $('form.vote_ballot > input:checked').prev().addClass('selected');
});

// Interaction Function
$(document).ready(function() {
    $('form.vote_ballot > label').click(function() {
        $(this).siblings().removeClass("selected").end()
            .addClass("selected");
    });
    $('form.vote_ballot').change(function() {
        $('form.vote_ballot').submit();
    });
});

这基本上允许用户进行“竖起大拇指”或“大拇指向下”投票。当用户编辑现有投票时，代码按预期工作，但是当他们创建新投票时，处理ajax请求并且需要再次调用初始设置函数。设置函数只应调用一次（这就是为什么它在document.ready块之外）。 document.ready块中的交互部分在ajax事件之前和之后工作正常。

我对jQuery的熟练程度不高，而且我无法弄清楚如何使用setup函数并为其命名，以便在ajax事件之后再次调用它。

任何帮助？

Answer 1

此代码：

$(function () {

和此：

$(document).ready(function() {

做同样的事情。所以你可以在一个块上处理所有内容，如下所示：

$(function () {
    var setupFunction = function() {
      $('form.vote_ballot > input:checked').prev().addClass('selected');
    }

    // Setup Function
    setupFunction();

    // Interaction Function
    $('form.vote_ballot > label').click(function() {
        $(this).siblings().removeClass("selected").end()
            .addClass("selected");
    });
    $('form.vote_ballot').change(function() {
        $('form.vote_ballot').submit();
    });

    // example ajax call:
    $.ajax({ ...
      success: function () {
        ...
        addSelected(); // call from here for example
        ...
      }
    });
});

如你所见，我将一部分代码包装到函数中（我称之为setupFunction），我可以在$(function () { ... });块

内的任何地方调用它

jQuery：命名一个泛型函数，这样我就可以在ajax事件之后调用它

1 个答案: