jQuery字段选择

Question

<form>
  <div class="content-search-block">
    <div class="search-bar">
      <div class="search-bar">
        <input type="text" class="form-control" id="dname" name="dname" value="" placeholder="Otsi töötajaid">
        <button type="submit" id="submit"   class="icon"><i class="fa fa-search"></i></button>
      </div>
    </div>
  </div>
</form>

所以我有这种搜索领域。这种在JavaScript文件上的开始。（是的，在WP中）但似乎我的脚本没有加载提交按钮？

jQuery(document).ready(function(){
  jQuery('#submit').click(function(){
    var name = jQuery("#dname").val();
  });
});

我甚至试过了

jQuery(document).ready(function(){
  jQuery('#submit').click(function(){
    var name = jQuery("#dname").val();
    jQuery.ajax({
      url: '/wp-admin/admin-ajax.php',
      type: 'POST',   // Adding Post method
      dataType: 'JSON',// Including ajax file
      data: {'action': 'do_search', 'dname':name}, // Sending data dname to post_word_count function.
      success: function(data){ // Show returned data using the function.
        alert(data);
      }
    });
  });
});

为什么？脚本在页面加载时排队并加载。仍然是虚无...

Answer 1

在您的代码中，您打开三个div标签，但只关闭了两个div标签

Answer 2

您需要阻止默认表单提交：

jQuery('#submit').click(function(e){
  ...
  e.preventDefault();
  // or
  return false;
});

或者做它

<button type="button" ...