Question

可以这样做吗？例如，我有以下代码：

@section('content' onload='MyFunction')
  <!--PAGE CONTENT...-->
  <div>
   <h1>Something...</h1>
   <select name="sel"></select>
  </div>
@endsection

<script type="text/javascript">

  function MyFunction(){

   obj = document.forms[0].sel;

   for (i=0; i<23; i++) {

    //A similar condition to onload() event.

  }
</script>

这样做是我的错吗？我在Laravel和PHP中工作。或者，也许使用类似于javascript中的Jquery函数的功能。

Answer 1

您必须了解jquery-3.3.1.min.js:2 DELETE http://127.0.0.1:8000/admin/members/2 404 (Not Found)是刀片标记。刀片标记在PHP内部处理。另外，刀片语法不根据需要接受参数@Section。

此外，在HTML / JS上，您都无法随意使用onload。

您有两种选择：

1 -在以下部分之后放置一个脚本标签：

onload

在此解决方案中，该功能将在浏览器加载此html之后立即调用，但html的其他部分可能尚未加载。

2 -将脚本标记放在文档上，以监视@section('content')  <div> <h1>Something...</h1> <select name="sel"></select> </div> <script> // Note that this function must have been declared before // this script tag, otherwise it will log an error: // "Uncaught ReferenceError: MyFunction is not defined" MyFunction(); </script> @endsection事件：

load

此方法的优点是仅在加载整个页面之后才调用它，因此<script> $(document).load(function() { MyFunction(); }); </script>标记的顺序无关紧要（除非jquery调用必须在jquery脚本标记之后

Answer 2

如果将HTML标记和脚本分为2个部分，则IMHO更好，例如：

 @section('content')
     <!--PAGE CONTENT...-->
     <div>
         <h1> Something ... </h1>
         <select name="sel"></select>
     </div>
     <script type="text/javascript">
     function MyFunction(){
         obj = document.forms[0].sel;
         for (i=0; i<23; i++) {
             //A similar condition to onload() event.
         }
     }     
    </script>
 @endsection
 @section('script')
     MyFunction();
     // every script here will run onload
 @endsection

并在您的布局中放置两个部分

 <main class="container">
      <section id="content">
           @yield('content')
      </section>
 </main>

 <script type="text/javascript">
        $(function(){
            @yield('script')
        });
 </script>

Answer 3

或者，如果您不想使用jQuery并采用本机方法，则可以使用：

document.addEventListener("DOMContentLoaded", function(event) {
  // do your stuff here
});

如何将onload（）事件添加到laravel的@section（'content'）中

3 个答案: