preventDefault(）在编辑html后不起作用

preventDefault() not working after editing html

本文关键字：html 不起作用 编辑 preventDefault      更新时间：2023-09-26

我有以下HTML：

<div class="artikelen">
 <div>
  <div>
   <img src="http://mijnmanege.nl/img/artikelen/1.png" alt="Article" />
  </div>
  <strong>Article</strong>
  <span>{artikel_groep} (<span data-artikel-groep-id="1">1</span>)</span>
  <img src="/img/v3/main/icons/geld.png" alt="Price" /> 999
  <form method="post">
   <input type="number" value="1" name="aantal" max="99" min="1" required="required" data-artikel-id="1" data-artikel-groep-id="1" />
   <input type="submit" value="Buy" name="submit" />
  </form>
 </div>
</div>

和下面的jQuery:

$(document).ready(function() {
 $('.artikelen form').submit(function(e) {
  alert('We are in!');
  e.preventDefault();
 });
});

当我按下提交按钮时，我会收到"We are in"（我们在）警报，表格将被阻止提交。但是，当我使用$（'.artikelen'）.html（代码…）时；要向artikelen类添加完全相同的html代码（当然没有第一个和最后一个），它仍然会被提交，甚至不会触发错误。

控制台不会给出任何错误。

提前谢谢。

很抱歉我的英语不好，我不是本地人。

如果要对表单重新定价，那么事件绑定就不存在了，可以使用委托来解决这个问题：

$(document).ready(function() {
 $(document).on('submit', '.artikelen form', function(e) {
  alert('We are in!');
  e.preventDefault();
 });
});
相关文章：