javascript - 表单提交连接到JS事件不起作用

我有以下代码：

  <form action="" id="search-form">
    <fieldset>
      <div class="rowElem">
        <input type="text">
        <a href="#" onClick="document.getElementById('search-form').submit()">
        <div>Search</div>
        </a></div>
    </fieldset>
  </form>

<script>
$(document).ready(function() {
$('#search-form').submit(function(event){
    event.preventDefault();
    alert("test");

});
});
</script>

当我提交表格时，我没有看到警报...我想念什么？

谢谢，

最佳答案

你为什么不做这样的事情

<form action="" id="search-form">
    <fieldset>
      <div class="rowElem">
          <input name="query" type="text" /><br />
          <a class="search" href="#">Search</a>
      </div>
    </fieldset>
</form>

和

var form = $('#search-form');
$('.search', form).click(function(event){
    event.preventDefault();

    var query = $('input[name="query"]', form).val();

    alert("test: " + query);

});

演示：Fiddle

如果您想将params用作ajax请求的一部分，则可以执行以下操作

var form = $('#search-form');
$('.search', form).click(function(event){
    event.preventDefault();

    var params = form.serialize();

    alert("test: " + form.serialize());

$.ajax({
    url: '...',
    data: params,
    ....
})

});