Question

我的Laravel 5.5应用程序的主要布局模板通过CDN加载jQuery 3.2.1（成功）。我检查了我的开发人员'网络'选项卡，以确保jQuery加载正常。（这是因为我可以看到200个HTTP状态代码）

<html>
    <head>
        <title>My app - @yield('title')</title>
    </head>

    <body>
        <div class="container">
            @yield('content')
        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
        </script>
    </body>
</html>

在扩展我的布局模板的模板中，我尝试编写一些jQuery来简单地提交表单。

@extends('layouts.app')

@section('content')
    <form id="my-form" action="{{ route('item.store') }}">
        <input type="text" name="name" />
        <button id="my-submit-button" type="submit">Add</button>
    </form>

    <script>
        $(document).ready(function() {
            $("#my-form").submit(function(event) {
                event.preventDefault();
            });

            $("#my-submit-button").click(function() {
                axios.post('/items', {
                    name: 'item-name',
                })
                .then(function (response) {
                    console.log(response);
                })
                .catch(function (error) {
                    console.log(error);
                });
            });
        });
    </script>
@endsection

问题是：我一直看到：“未捕获的ReferenceError：$未定义”。我究竟做错了什么？

谢谢！

Answer 1

这种情况正在发生，因为您在使用脚本标记加载jQuery库之前使用<html> <head> <title>My app - @yield('title')</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> </script> </head> <body> <div class="container"> @yield('content') </div> </body> 将代码加载到布局模板中。更改你的html，将jquery链接放在head标签的上方，使用它的代码。

 app:rippleColor="@android:color/transparent"  app:rippleColor="@color/colorPrimary" android:clickable="true"

未捕获的ReferenceError：$未在Laravel 5.5应用程序中定义

1 个答案: