preventDefault（）方法不编辑HTML

Question

工作后，我有以下的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(); 
}); 
}); 

当我按下提交，我得到了 “我们是在” 警报并且表单被阻止被提交。但是，当我使用$（'。artikelen'）。html（code ...）;为类artikelen添加完全相同的html代码（没有第一个和最后一个课程），它仍然被提交，甚至不会触发错误。

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

在此先感谢。

对不起任何不好的英语，我不是一个本地人。

Answer 1

你repacing表单，因此该事件绑定走了，你可以使用委托来解决：

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