2016-03-29 7 views
1

dies ist mein erster Versuch Javascript und ich bin immer die folgende in der Chromkonsole:HTML-Schaltfläche nicht Funktion aufrufen

„Uncaught Reference. Test1 nicht definiert ist“

Ich versuche, eine Ajax Anfrage über onclick button event zu senden und die Daten im Dokument anzuzeigen. Aufgrund des Fehlers habe ich mich jedoch nur für einen Debug-Versuch auf Hallo-Welt beschränkt. Entschuldigen Sie diese Art von Frage, wie ich es sehr elementar weiß.

Jede Hilfe wird geschätzt. Vielen Dank für Ihre Zeit!

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 

<button onclick="test1()">Click Here</button> 
<p id="Data"></p> 


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

function test1(){ 
alert("Hello, World"); 
/* $.ajax({ 
    url: Target_URL, 
    headers: { 
     'Accept':'application/json', 
     'authorization', 'Bearer ' + vToken 
    }, 
    method: 'GET' 
    // dataType: 'json', 
    // data: YourData, 
    success: ajaxCall = data 
    }); */ 
} 
</script> 

</body> 

</html> 
+2

Bewegen Sie Ihr JS über die Schaltfläche. – Oisin

+1

Versuchen Sie, die 'src' zu entfernen. Die Funktion ist eine benannte, also sollte sie zur Kompilierzeit hochgezogen werden. –

+0

überprüfen Sie das, JavaScript-Code ist wahr, aber Ihr HTML-Code ist nicht gut, überprüfen Sie diese http://dojo.telerik.com/ewiCE –

Antwort

7

Sie verwendet nur ein script Tag zum Laden jquery und für Ihre Methode - die ... "If a script element has a src attribute specified, it should not have a script embedded inside its tags." hier eine funktionierende Lösung wird nicht funktionieren:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
</head> 
 
<body> 
 

 
<button onclick="test1()">Click Here</button> 
 
<p id="Data"></p> 
 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<script> 
 
function test1(){ 
 
alert("Hello, World"); 
 
/* $.ajax({ 
 
    url: Target_URL, 
 
    headers: { 
 
     'Accept':'application/json', 
 
     'authorization', 'Bearer ' + vToken 
 
    }, 
 
    method: 'GET' 
 
    // dataType: 'json', 
 
    // data: YourData, 
 
    success: ajaxCall = data 
 
    }); */ 
 
} 
 
</script> 
 

 
</body> 
 

 
</html>

+3

Dies ist die richtige Lösung. Eine Erweiterung zu meinem faulen Kommentar. –

+1

Das funktioniert! Vielen Dank – Arch1medes

+0

Sie sollten wirklich Ihre js entweder in den Kopf, oder eine externe Datei obwohl :) – Stuart

-1

Setzen Sie die JavaScript in den head Ihres Dokuments, und trennen Sie das Skript aus für jquery und Ihren tatsächlichen Code enthält.

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 

<script> 
function test1(){ 
    alert("Hello, World"); 
} 
</script> 
</head> 
<body> 
    <button onclick="test1()">Click Here</button> 
    <p id="Data"></p> 
</body> 
</html> 
+0

Vielleicht fügen Sie den festen Code zu Ihrer Antwort? – Oisin

+1

Die Funktion ist genau definiert. Das Problem besteht darin, ein externes Skript zu laden und Code innerhalb desselben Skript-Tags zu schreiben. –

+0

Down für eine richtige Antwort gewählt? Geht SO alles Redditty? – Stuart

-3

First off, Sie müssen Ihre JavaScript-Funktion deklarieren, bevor Sie sie aufrufen.

Änderung dieser:

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js" /> 
<script> 
    function test1(){ 
     alert("Hello, World"); 
    } 
</script> 

<button onClick="test1()">Click Here</button> 
<p id="Data"></p> 

</body> 

</html> 
+0

Die Funktion ist gut definiert. Das Problem besteht darin, ein externes Skript zu laden und Code innerhalb desselben Skript-Tags zu schreiben. –

-1

Sie haben die Javascript-Methode in der richtigen JavaScript-Tag nicht gesetzt, getrennt JavaScript-Methode platzieren und src JavaScript aktivieren, bitte für weitere Klärung unten überprüfen:

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 

<script type="text/javascript"> 
    function test1() { 
    alert("Hello, World"); 
    } 
/* $.ajax({ 
    url: Target_URL, 
    headers: { 
     'Accept':'application/json', 
     'authorization', 'Bearer ' + vToken 
    }, 
    method: 'GET' 
    // dataType: 'json', 
    // data: YourData, 
    success: ajaxCall = data 
    }); */ 
</script> 

</head> 
<body> 

<button onclick="test1()">Click Here</button> 
<p id="Data"></p> 

</body> 

</html> 
1

Sie können Ihren JavaScript-Code nicht in denselben <script> Tag einfügen, an dem Sie eine externe Datei verknüpft haben (sie sollte nicht in <script src="..."> Funktion </script> enthalten sein). Ihre test1-Funktion sollte vom scr-JavaScript-Tag getrennt sein. Versuchen Sie dies:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">/<script> 
<script> your javascript function should be here </script> 

Ich hoffe, dies wird Ihr Problem lösen.