jQuery Laravel Blade 使用 $(document).ready 函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/36736177/
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 blade use $(document).ready function
提问by Jukka Newkampton
I'm trying to use laravel blade templates including some javascript code into child view.
我正在尝试在子视图中使用包含一些 javascript 代码的 laravel 刀片模板。
I have my mail app.blade.phpfile, where is placed string of jquery initialization:
我有我的邮件app.blade.php文件,其中放置了 jquery 初始化字符串:
<script src="/js/jquery.min.js"></script>
In my subview file settings.blade.phpI want to use some jquery functions:
在我的子视图文件settings.blade.php 中,我想使用一些 jquery 函数:
@extends('layouts.app')
@section ('content')
Settings main page
@endsection
<script type="text/javascript">
$(document).ready(function() {
alert("Settings page was loaded");
});
</script>
But in browser console I get an error message Uncaught ReferenceError: $ is not definedwhich seems like jquery was loaded AFTERcalling that function in subview file.
但是在浏览器控制台中,我收到一条错误消息Uncaught ReferenceError: $ is not defined这似乎是在子视图文件中调用该函数后加载了 jquery 。
Adding a row: <script src="/js/jquery.min.js"></script>
into settings.blade.phpresolves the problem. But I dont want to add my script files into each of my subview file.
添加一行:<script src="/js/jquery.min.js"></script>
到settings.blade.php解决此问题。但我不想将我的脚本文件添加到我的每个子视图文件中。
So question: how can I load main javascript\jquery files in parent blade file BEFOREloading subview files?
所以问题:如何在加载子视图文件之前在父刀片文件中加载主要的 javascript\jquery文件?
回答by Qazi
Please follow this way
请按照这条路
for jquery script file do this
对于 jquery 脚本文件,请执行此操作
<script src="{!!url('/js/jquery.min.js')!!}"></script>
and do this for content section
并对内容部分执行此操作
@extends('layouts.app')
@section ('content')
Settings main page
<script type="text/javascript">
$(document).ready(function() {
alert("Settings page was loaded");
});
</script>
@endsection
Updated
更新
Rather to scripting in content section, it would much better and professional way to create another section for scripting in app.blade.php
而不是在内容部分编写脚本,在app.blade.php 中创建另一个脚本部分会更好更专业
normally I follow this way
通常我遵循这种方式
<html>
<head>
@yield('page-style-files')
</head>
<body>
<div class="wrapper">
@yield('content')
</div>
</body>
@yield('page-js-files')
@yield('page-js-script')
<html>
so for example your code will look like this
所以例如你的代码看起来像这样
@extends('layouts.app')
@section ('content')
Settings main page
@endsection
@section('page-style-files')
<link href="....css" />
@stop
@section('page-js-files')
<script src=".....js"></script>
@stop
@section('page-js-script')
<script type="text/javascript">
$(document).ready(function() {
alert("Settings page was loaded");
});
</script>
@stop
回答by Matt
I had this same problem which seemed more to do with the js files being loaded in with the deferattribute.
我遇到了同样的问题,这似乎与使用defer属性加载的 js 文件有关。
I was getting the same console warning about $ not being defined.
我收到了关于 $ 未定义的相同控制台警告。
So I tested this notion with...
所以我测试了这个概念......
<script type="text/javascript">
setTimeout(function () {
$(document).ready(function(){
alert('now');
});
}, 5000);
</script>
Which then worked, so I assume it's to do with defer(using Firefox Developer Edition on Linux Mint).
然后起作用了,所以我认为它与defer(在 Linux Mint 上使用 Firefox Developer Edition)有关。
Anyway, a good reason to put all my scripts into proper js files ;-)
无论如何,这是将我所有的脚本放入正确的 js 文件的一个很好的理由;-)