Warum umschließt JavaScript in diesem "(function ($) {... JavaScript code ..}) (jQuery);"?

Ich benutze mvc5. Schließen Sie jQuery nicht in den Test ein. _Layout.cshtml:

<!DOCTYPE html> 
 
<html lang="en-US"> 
 
<head> 
 
    <title></title> 
 
</head> 
 
<body> 
 
    @RenderBody() 
 
</body> 
 
</html>

Test.cshtml:

<script type="javascript/text"> 
 
    function myFunction() { 
 
    alert("its is working"); 
 
    } 
 
</script> 
 
<button onclick="myFunction()">Click me</button>

Im Ergebnis habe ich einen Fehler: Reference: myFunction ist nicht definiert

und der Ergebniscode:

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
    <title></title> 
</head> 
<body> 
    <button onclick="myFunction();">Click me</button> 
<script type='text/javascript' > 
(function($){ 
    function myFunction() { 
     alert("I am working"); 
    }; 
})(jQuery); 
</script> 
</body> 
</html>

ich viel über diesen Fehler gelesen haben und die Antwort nicht begründet. Könntest du klären, wer JavaScript Code einpackt? Gibt es eine Flagge, um es abzubrechen? Gibt es eine andere Möglichkeit, das Problem zu lösen?

Quelle

2016-05-23 Iva

Inline-Funktionen sollen im globalen Umfang zugegriffen werden..Die Funktion 'Definition' in' IIFE' nicht umhüllen – Rayon

und Inline-Funktionen sind eine schrecklich veraltete Art der Behandlung von Ereignissen, vor allem, da Sie bereits verpflichtet sind jQuery verwenden – Alnitak

Diese spezielle Funktion ist eine der Möglichkeiten, einen 'document.ready'-Event-Handler für jQuery auszuführen, um sicherzustellen, dass das DOM vollständig geladen ist, bevor der Code ausgeführt wird. Sie würden dies normalerweise tun, wenn Sie DOM-Elemente in Ihrem Skript referenzieren müssen, so dass diese vor dem Ausführen sicher sind. Um das Problem zu lösen, verschieben Sie 'myFunction()' einfach außerhalb dieser anonymen Funktion, so dass es einen globalen Gültigkeitsbereich hat. – Archer

Etwas (wahrscheinlich MVC5) ist Ihr Code für Sie verpackt, aber mit gutem Grund. Setzen Sie onclick Handler auf Elemente, die auf eine global deklarierte Funktion zeigen, wie JS in den 90er Jahren geschrieben wurde.

es zu beheben, ein id Attribut auf dem Knopf an setzen und die Inline-Event-Handler entfernen:

<button id="mybutton">

und dann jQuery verwenden, um die Event-Handler zu registrieren:

$('#mybutton').on('click', function() { 
    alert("I am working"); 
});

oder, da Sie In späteren Kommentaren erwähnt, dass Sie eine Schleife haben, die diese Elemente generiert, verwenden Sie stattdessen ein class und ein data- Attribut:

<button class="myclass" data-id="...">

mit Code:

$('.myclass').on('click', function() { 
    var id = $(this).data('id'); 
    ... 
});

Quelle

2016-05-23 08:43:43 Alnitak

danke für die Antwort. In diesem Fall habe ich einen Fehler; ReferenceError: jQuery ist nicht definiert}) (jQuery); – Iva

@Iva so müssen Sie 'jQuery' mit einem'

-2

<script> 
function myFunction() { 
alert("its is working"); 
} 
</script> 
<button onclick="myFunction()">Click me</button>

Dies funktioniert. cheers

Quelle

2016-05-23 08:49:30

Verwandte Themen