由于未捕获的引用错误，卡不会翻转

Question

我有一张卡片，一面显示一个内容，另一面显示不同的内容。通过a标记上的onClick调用触发翻转。但是，我遇到了flip未被捕获的引用错误。我应该采取哪些步骤来调试它？我已经仔细检查了html和JS的语法（一切似乎都很好）。

HTML

p.footer: #[a(href='#', onclick='flip()') About #[span]]

JS

$(document).ready(function () {

  // FLIP IT

  function flip () {
    $('.card').toggleClass('about');
  }

});

错误

Uncaught ReferenceError: flip is not defined
 onclick @ (index):1

Answer 1

flip()位于$(document).ready的本地，您无法使用onclick='flip()'进行访问。

最好使用jquery在ready()中分配处理程序。

$('p.footer a:contains(About)').click(flip);