Wie kann ich JavaScript-Funktion global einstellen?

Question

Ich möchte meine Funktion in globalen js einstellen. So kann es von überall genannt

habe ich Funktion dieses:

$(function() { 
    function formatCurrency(input) { 
     return input.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1."); 
    } 
}); 

ich die Funktion auf der

setzen

C:\xampp\htdocs\mysystem\resources\assets\js\main.js

Und ich fügen Sie diese: <script src="{{URL::asset('/resources/assets/js/main.js')}}"></script> auf dem

C:\xampp\htdocs\mysystem\resources\views\layouts\app.blade

Bei der Ausführung gibt es auf der Konsole einen Fehler wie diesen:

GET http://mysystem.dev/resources/assets/js/main.js 404 (Not Found)

Wie kann ich es lösen?

Answer 1

Das Problem scheint zu sein, dass Sie asset() falsch verwenden.

Asset bezieht sich auf eine Datei in /public.

Sie kompilieren sollte/minimieren Sie Ihre JS für die Produktion und steckte es irgendwo in /public, das heißt /public/js/my.js

Answer 2

können Sie globale Funktion wie diese

window.formatCurrency = function(input){ 
      return input.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1."); 
     } 

definieren und Sie sind definieren Funktion in Ready-Funktion ($ (Funktion)) dann das müssen Sie auch in ready-Funktion aufrufen. Also besser definieren Sie es außerhalb der fertigen Funktion oder in selbstaufrufenden Funktion.

Answer 3

Sie sollten Ihre Funktion als eine Methode des Fensterobjekts definieren.

window.formatCurrency = function(input) { 
    return input.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1."); 
} 

Ein weiterer sauberer wie es Ihre Funktion als Methode eines Objekts namens Utils, zu definieren, wie unten sein würde:

var Utils = (function(){ 
    function formatCurrency(input){ 
     return input.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1."); 
    } 
    return { 
     formatCurrency: formatCurrency 
    } 
}()); 

Dabei werden Sie nicht verschmutzen den globalen Namespace. Im globalen Namespace namens Util wird nur eine Variable definiert, die eine Obejct mit nützlichen Funktionen enthält, die von anderen Teilen Ihrer Anwendung verwendet werden können. So wie es ist, können Sie die Vorteile des letzteren Ansatzes nicht sehen. Sie können jedoch überlegen, wie es wäre, wenn Sie 3 weitere Funktionen nutzen möchten, die selbst 2 weitere Funktionen als Helfer verwenden. Wenn das der Fall wäre, würde Ihre Return-Anweisung auch die 3 weiteren Funktionen enthalten, während die 2 Funktionen, die ich zuvor erwähnte, überhaupt nicht epxosiert wären!