jQuery 提交无效

Question

我知道已经有人问过这种问题，但我找不到解决问题的办法。在我的 HTML 文件中我有这个代码：

<div>
        <form id="chart-input">
            <input type="text" name="country" placeholder="Country" autocomplete="off">
            <input type="number" name="visits" placeholder="Visits" autocomplete="off"> 
            <button>Send</button>
        </form>
</div>

我尝试使用 jQuery 处理此表单的提交，但它似乎不起作用。

这是我的 js 文件：

jQuery('#chart-input').on('submit', function (e) {
  e.preventDefault();

  let countryTextbox = jQuery('[name=country]');
  let visitsTextbox = jQuery('[name=visits]');


    socket.emit('addData', {
      "country": countryTextbox,
      "visits": visitsTextbox
    }); 
});

有什么问题吗？当我单击按钮 preventDefault() 并且其他代码未执行时。希望任何人都知道解决方案。谢谢

Answer 1

确保您已注册jQuery并按以下方式操作：

将您的 javaScript 代码放在 HTML 之后或将其更改为：

jQuery(document).ready(function(){
    jQuery('#chart-input').on('submit', function (e) {
          e.preventDefault();

          let countryTextbox = jQuery('[name=country]');
          let visitsTextbox = jQuery('[name=visits]');

          socket.emit('addData', {
            "country": countryTextbox,
            "visits": visitsTextbox
          }); 
    });
});

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<form id="chart-input">
    <input type="text" name="country" placeholder="Country" autocomplete="off">
    <input type="number" name="visits" placeholder="Visits" autocomplete="off">
    <button>Send</button>
</form>
<script>
    jQuery(document).ready(function() {
        jQuery('#chart-input').on('submit', function(e) {
            e.preventDefault();

            let countryTextbox = jQuery('[name=country]');
            let visitsTextbox = jQuery('[name=visits]');

            //socket.emit('addData', {
             //   "country": countryTextbox,
             //   "visits": visitsTextbox
            //});
            alert('it works!!!');
        });
    });
</script>

Answer 2

将 <button>Send</button> 更改为 <button type="submit">Send</button>，它将起作用

jQuery 提交无效

jQuery on submit doesn't work

html

javascript

jquery

submit