javascript - 我可以用原型(prototype)函数简化它吗？

Question

我是 jQuery 原型(prototype)的新手。我多次执行相同的代码:

   $message
        .removeClass()
        .addClass("message error")
        .show()
        .html('<li>' + json.Errors.join('</li><li>') + '</li>');

这里的变量是“error”和html数据。对于成功，addClass 将是“消息成功”。

有没有一种方法可以将这四个函数组合成一个函数，然后只调用一个函数并将成功/错误和数据传递给它？

Answer 1

添加您自己的 jQuery 函数很容易:

$.fn.showErrors = function() {
  return this.removeClass().addClass("message error").show()
    .html('<li>' + json.Errors.join('<li>'));
};

然后:

$message.showErrors();

请注意，您实际上并不需要 </li>结束标签。

通常，一个 jQuery 函数作为 $.fn 的属性添加应该期待 this引用当前的 jQuery 对象。该函数应该返回该值，以便 jQuery 的正常链接行为能够工作。一件有点令人困惑的事情是因为 this 已经 是一个 jQuery 对象，没有必要再次包装它——不需要写 $(this)换句话说。

编辑 — 抱歉，我已经离开 Internet 一段时间了(令人震惊!)该代码假定“json”只是四处飘荡。它可能应该是一个参数:

$.fn.showErrors = function(json) {
  return this.removeClass().addClass("message error").show()
    .html('<li>' + json.Errors.join('<li>'));
};

调用它:

$message.showErrors(json);