Question

在laravel 5.6 / jquery应用程序中，我需要创建一些具有常见功能的js文件，并且可以在我项目的所有js文件中访问并为此在应用模板中资源/视图/卡片BS41Frontend / layouts / frontend.blade.php我添加了js / app_funcs.js的定义：

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>@if(isset($site_name)){{ $site_name }}@endif</title>

    <!-- Styles -->
    <link href="{{ asset('css/frontend.css') }}" rel="stylesheet">
    <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">

    <!-- Scripts -->

    <script src="{{ asset('js/jquery-3.3.1.min.js') }}"></script>

    <script src="{{ asset('js/app.js') }}{{  "?dt=".time()  }}" defer></script>
    <script src="{{ asset('js/app_funcs.js') }}{{  "?dt=".time()  }}" defer></script>
    <script src="{{ asset('/js/bootstrap.js') }}" defer></script>

    <!-- Fonts -->
    <link rel="dns-prefetch" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css?family=Raleway:300,400,600" rel="stylesheet" type="text/css">

</head>
<body>
<div id="app">

    <main class="py-4">
        @yield('content')
    </main>
</div>

@section('scripts')


@endsection

@yield('scripts')


</body>

@include($frontend_template_name.'.layouts.footer')
</html>

在刀片模板资源/视图/卡BS41Frontend / vote.blade.php中，我附加了/vote.js文件，该文件仅引用以下模板：

@extends($frontend_template_name.'.layouts.frontend')
@section('content')
    <div class="container">
      ...CONTENT OF MY PAGE
    </div>


@endsection

@section('scripts')

            <script src="{{ asset('js/'.$frontend_template_name.'/vote.js') }}{{  "?dt=".time()  }}"></script>

            <script type="text/javascript" language="JavaScript">
                /*<![CDATA[*/

                var frontendVote = new frontendVote('view',  // must be called before jQuery(document).ready(function ($) {
                    <?php echo $appParamsForJSArray ?>
                );
                jQuery(document).ready(function ($) {
                    frontendVote.onFrontendPageInit('view')
                });

                /*]]>*/
            </script>

 @endsection

但是在voice.js文件中，当我调用js / app_funcs.js文件的js函数时，出现了错误

Uncaught ReferenceError: functionname is not defined

我希望使用js / app_funcs.js的功能，因为此文件已附加，并且可以在浏览器的控制台中看到在/vote.js之前就可以正常检索该文件js / app_funcs.js。

您能给我一个提示，什么是错的，什么是正确的方法？

谢谢！

Answer 1

您正在使用app_funcs.js加载defer脚本。这意味着脚本会与HTML并行加载，但会推迟执行，直到HTML被解析为止。由于您是在没有vote.js的情况下加载defer脚本的，因此它将立即停止HTML解析，加载和执行，从而有效地在app_funcs脚本之前运行该脚本。要么也延迟您的vote脚本的负载，要么不要将defer与app_funcs脚本一起使用。

使用通用js库的功能

1 个答案: