如何通过laravel中的ajax将div的子元素传递给控制器？答案

【问题标题】：How to pass child element of div to controller through ajax in larvavel?如何通过laravel中的ajax将div的子元素传递给控制器？
【发布时间】：2021-08-06 06:39:57
【问题描述】：

我想通过 ajax 调用将 div 的子元素传递给 laravel 项目中单击按钮的控制器。

这里是 div..`

 <button type="button" id="saveForm" class="btn btn-primary float-right">Save</button>

<div class="col-9 canvas">
      <input type="text"  name="firstname" placeholder="email">
      <input type="text" name="firstname" placeholder="password" >
      <input type="button" onclick="myBtn()" value="login">
</div>

为了将元素传递给控制器，我使用了以下 ajax 代码..

<script>
    $(document).ready(function(){
      $("#saveForm").click(function(){
          var canvas = $(".canvas");

          $.ajax({
          url: "{{ route('save.form') }}",
          type: "post",
          data:{data:canvas},
          success: function(data){
            console.log(data);
          }
        });
      });
    });
</script>

但是我不能传递 div 的子元素。如何传递子元素？

【问题讨论】：

标签： jquery ajax laravel parent-child element

【解决方案1】：

如果您正在寻找传递 .canvas 块的 html

var canvas = $(".canvas")[0].outerHTML;

如果您正在寻找 .canvas html 的内部，那么

var canvas = $(".canvas").html();

完整代码

<script>
    $(document).ready(function(){
      $("#saveForm").click(function(){
          var canvas = $(".canvas")[0].outerHTML;

          $.ajax({
          url: "{{ route('save.form') }}",
          type: "post",
          data:{data:canvas,"_token": "{{ csrf_token() }}"},
          success: function(data){
            console.log(data);
          }
        });
      });
    });
</script>

【讨论】：