Question

只想在这里明确一个概念。

假设我有这个html页面：

        <script>
        function_1()
           {
          ... posts a form via ajax
           };
        </script>



<body>
<div class='car'>

</div>
</body>

关于我prepend()此事件（我通过ajax获取）到上述<div class='car'>

的事件

<form method='post'>
...
<button type='submit' value='post' />
</form>

我们的想法是通过按下提交按钮调用function_1函数，通过ajax提交此表单。

这有用吗？因为当我提交表单时，它不会调用function_1，它只是通过常规的Http帖子发布它。

当我们将append()或prepend()个元素添加到DOM时，他们是否可以立即访问javascript？

谢谢

Answer 1

您需要使用委派的事件处理程序，例如：

$(document).on("submit", "#your-form-id", function(e) {
  e.preventDefault();
  // AJAX code
});

然后，只要表单存在，无论何时附加表单，都会在提交时调用处理程序。

Answer 2

您正在运行时附加这些表单元素，因此您必须使用event-delegation为其注册事件。顺便说一下，它是一个提交按钮，所以每当你点击它时，它只会调用它的默认动作，即提交表单。因此，您应该使用e.preventDefault()来阻止其默认行为，或者您需要将该按钮的类型从submit更改为button

尝试，

<script>
$(document).ready(function(){
          function function_1()
           {
              ... posts a form via ajax
           };

          $(document).on("click", "input[type='submit']", function(e) {
               e.preventDefault();

               function_1()
          });
});      
</script>

从附加元素调用javascript

2 个答案: