JavaScript函數不與Laravel混合定義

首先，在資源/ js代碼/ app.jsJavaScript函數不與Laravel混合定義

function button1Clicked(){ 
    console.log('Button 1 is clicked'); 
}

其次，在testing.blade.php

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="csrf-token" content="{{ csrf_token() }}"> 
    <title>Testing</title> 
</head> 
<body> 
    <button onclick="button1Clicked()">Button 1</button> 
    <button onclick="button2Clicked()">Button 2</button> 

    <script type="text/javascript" src="{!! asset('js/app.js') !!}"></script> 
    <script type="text/javascript"> 
    function button2Clicked(){ 
     console.log('Button 2 is clicked'); 
    } 
    </script> 
</body> 
</html>

代碼npm run dev和測試後本地主機

其結果是，JavaScript的FUNC沒有定義button1Clicked()resources/js/app.js。但可以定義testing.blade.php中的功能button2Clicked()。是從Laravel混合錯誤或我做了一些錯誤

來源

2017-10-09 YChen

你可以嘗試使用 – iCoders

你可以添加你的'webpack.mix .js'和'app.js'文件？ –

iCoders是正確的，你需要使用'{{}}'而不是'{!!'，因爲'{!!'用於顯示非轉義內容 –

如何消除onclick屬性並添加ID：

<button id="btn1">Button 1</button>

腳本

$(document).ready(function(){ 
    function button1Clicked(){ 
     console.log('Button 1 is clicked'); 
    } 
    $("#btn1").click(button1Clicked); 
});

檢查的代碼片段

$(document).ready(function() { 
 
    function button1Clicked() { 
 
    console.log('Button 1 is clicked'); 
 
    } 
 
    $("#btn1").click(button1Clicked); 
 
});

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

 
<body> 
 
    <button id="btn1">Button 1</button> 
 
    <button onclick="button2Clicked()">Button 2</button> 
 

 
    <script type="text/javascript" src="{!! asset('js/app.js') !!}"></script> 
 
    <script type="text/javascript"> 
 
    function button2Clicked() { 
 
     console.log('Button 2 is clicked'); 
 
    } 
 
    </script> 
 
</body>

來源

2017-10-10 00:19:52

所以如果我有很多JavaScript函數，我必須將所有函數放在$（document）.ready （）?? – YChen

JavaScript函數不與Laravel混合定義

回答

相關問題