Coffeescript绑定提交表单，以显示div提交

Question

我试图在按下提交按钮时显示加载gif，但我的coffeescript似乎不工作。当我提交表单时，如何使用Coffeescript显示div ?

Coffeescript:

$(document).ready ->
$('form#add_product_form').submit ->
    console.log("test")
    $("#circularG").show()
    false

HTML表单:

<form accept-charset="UTF-8" action="/products/new" data-remote="true" id="add_product_form" method="post"><div style="display:none"><input name="utf8" type="hidden" value="✓"></div>
      <p>
        <label for="link_url">Url</label><br>
        <input autofocus="autofocus" id="link_url" name="link[url]" type="text">
      </p>
      <p>
        <input class="btn btn-primary" name="commit" type="submit" value="Add Product">
      </p>
</form>

我的Coffeescript正在被编译成js如下:

  $(document).ready(function() {
return $('form#add_product_form').submit(function() {
  console.log("test");
  $("#circularG").show();
  return false;
});

});

Answer 1

请确保在第二行前添加空格

$(document).ready ->
  $('form#add_product_form').submit -> #HERE
    console.log("test")
    $("#circularG").show()
    false

Answer 2

您必须将"submit"事件附加到FORM元素上，例如

  $('#id_for_form').submit ->
    $('.div').show()