php Laravel 5.6 - 我需要包含 JQuery 还是它已经包含在 app.js 中？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/49539639/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Laravel 5.6 - Do I need to include JQuery or is it already included in the app.js?
提问by NoNice
I have created a Laravel 5.6 project on my local.
我在本地创建了一个 Laravel 5.6 项目。
I have <script src="{{ asset('js/app.js') }}" defer></script>in <head>
我<script src="{{ asset('js/app.js') }}" defer></script>在<head>
In one of the views, I tried
在其中一种观点中，我尝试了
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery( "#ddtype" ).change(function() {
alert( "Handler for .change() called." );
});
});
</script>
but it gives me jQuery is not definederror
但它给了我jQuery is not defined错误
If I try Bootstrap 4's collapse function, it works fine. Does that mean jQuery is already included?
如果我尝试 Bootstrap 4 的折叠功能，它工作正常。这是否意味着 jQuery 已经包含在内？
I have done npm installand npm run dev
我已经完成npm install并且npm run dev
My resources/js/app.jsrequires bootstrap.jswhich looks like (not full code but top few lines) as below
我的resources/js/app.js需求bootstrap.js看起来像（不是完整的代码，而是前几行）如下
window._ = require('lodash');
window.Popper = require('popper.js').default;
/**
* We'll load jQuery and the Bootstrap jQuery plugin which provides support
* for JavaScript based Bootstrap features such as modals and tabs. This
* code may be modified to fit the specific needs of your application.
*/
try {
window.$ = window.jQuery = require('jquery');
require('bootstrap');
} catch (e) {}
Please advise. I have checked in different browsers to make sure no cache issues etc.
请指教。我检查了不同的浏览器以确保没有缓存问题等。
Update
更新
My layouts/app.blade.php structure is like this -
我的 layouts/app.blade.php 结构是这样的 -
<html>
<head>
....
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
....
</head>
<body>
<div id="app">
@include('layouts.nav')
<main class="py-4">
@yield('content')
</main>
</div>
</body>
</html>
and myview.blade.php
和 myview.blade.php
@extends('layouts.app')
@section('content')
.....
.....
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery( "#ddtype" ).change(function() {
alert( "Handler for .change() called." );
});
});
</script>
@endsection
回答by Chin Leung
jQuery loaded via your app.js, which is only loaded once the page is ready because of the deferattribute in your script tag.
jQuery 通过您的app.js加载，由于defer脚本标记中的属性，它仅在页面准备就绪后加载。
Your inline script tag where you call jQuery(document).readyis loaded as the page renders, therefore executed before the app.jshas been loaded. Hence the error, since jQuery is not yet loaded at that time.
您调用的内联脚本标记在jQuery(document).ready页面呈现时加载，因此在app.js加载之前执行。因此出现错误，因为当时 jQuery 尚未加载。
To fix it, simply remove the deferattribute from the script tag.
要修复它，只需defer从脚本标记中删除该属性。
The defer attribute is a boolean attribute.
When present, it specifies that the script is executed when the page has finished parsing.
defer 属性是一个布尔属性。
当存在时，它指定在页面完成解析时执行脚本。
For more information about the defer attribute: https://www.w3schools.com/tags/att_script_defer.asp
有关 defer 属性的更多信息：https: //www.w3schools.com/tags/att_script_defer.asp
