使用ajax添加html块后，动画（jquery）不起作用

Question

如果你强行添加这个块，那么一切正常。我的搜索使我发现，当单击输入时，聚焦的类不会添加到其中。 1 个屏幕截图 - 如果强制添加 html，它是如何工作的，2 个屏幕截图 - 使用 ajax 加载后如何工作

<html>
<div class="container-fluid py-4 contents">
    </div>
 <script src="../assets/js/core/popper.min.js"></script>
  <script src="../assets/js/core/bootstrap.min.js"></script>
    <script src="../assets/js/material-dashboard.min.js?v=3.1.0"></script>
  <script src="../assets/js/plugins/perfect-scrollbar.min.js"></script>
  <script src="../assets/js/plugins/smooth-scrollbar.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
  <script src="../assets/js/plugins/chartjs.min.js"></script>
      <!-- Github buttons -->
  <script async defer src="https://buttons.github.io/buttons.js"></script>

  <script>
async function Send_ajax(data,dataType,url){
   var result ="";
 try {
       
    $.ajax({
        url:url, //url  (action_ajax_form.php)
        type:"POST",
        async:false,
        data:data,  
        dataType: dataType, // 
        success:function(data){ 
        result = data;
},
        error: function(response) { // Данные не отправлены
           result= response;
        }
         
    });
   
  } catch(error) {
    // handle error, set some error state, display error toast, etc...
    result= error;
  }
  return result;
  }
  $(document).ready(function(){
    Send_ajax("","html","../php/admin/get_config_form.php").then((result) => {
     $(".contents").html(result)
     });
      });
</script>
</html>

Answer 1

根据您的问题描述，问题似乎是您有一个动画要运行，并且该动画至少部分是用 Javascript 实现的，将一些事件附加到您的 HTML 元素。

现在，如果您的 HTML 在页面加载时出现，那么您的事件会正确附加到它，因此您的动画会正确运行，而如果您通过 AJAX 获取 HTML，然后

$(".contents").html(result)

然后 HTML 结构已正确添加到您的容器中，但 Javascript 事件未按您的预期附加。要解决此问题，您需要确定动画需要运行哪些事件，将这些事件的定义分离到要执行的功能中，然后确保在根据结果更改 HTML 后运行该功能。

或者，如果您事先知道结构，并且可能响应的唯一区别是某些字段的值，那么您可以重构您的方法，这样您将在响应中收到 JSON，而不是 HTML 结构，并更改您的值字段而不是结构，因此您不必费心（重新）附加事件处理程序。

最后，您的硬编码结构也可能在某些方面与您在 AJAX 中收到的结构不同，因此您需要仔细比较之前硬编码的结构与作为 AJAX 响应收到的结构并进行修复差异。

使用ajax添加html块后，动画（jquery）不起作用

问题描述投票：0回答：1

1个回答

最新问题

使用ajax添加html块后，动画（jquery）不起作用

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1