Trigger js Ereignisse wie onclick von einer externen js Datei

Ich entschuldige mich aufrichtig für diese Frage, aber das ist meine 72. Stunde der Programmierung in Javascript und aus mir unbekannten Gründen kann ich die Antwort auf diese Frage nicht finden.Trigger js Ereignisse wie onclick von einer externen js Datei

Ich muss Event-Handler wie onclick, aus einer externen js-Datei auslösen können. So habe ich meine Dateien in meinem HTML verlinkt.

<header> 
<h1>McMac editing</h1> 
<meta charset="utf-8"> 
<script src="JQuery.js"></script> 
<script src="index.js"></script> 
</header>

So richte ich index.js ein.

var capture = document.getElementById("capture"); 
capture.onload = function(){console.log="load";};

Ich werde mit cordova schließlich, und es sagt, dass es, dass Inline-JS deaktiviert ist, so ist dies, warum ich diese Arbeit benötigen und jetzt mit meinem aktuellen Setup „load“ ist Aufspringen nicht in meinem Konsole.

Noch einmal, ich entschuldige mich für die Frage, aber ich weiß nicht, was zu tun ist.

Quelle

2016-05-29 FARSOS BULSARA

'function() {console.log ("load");};' – Rayon

@FARSOS Bulsara, was ist das Element "capture"? (form? id? oder ...) – Ehsan

in Ihrem HTML-Abschnitt haben Sie kein solches Element mit "Capture" ID –

HTML-Code:

<html> 
<head> 
<title></title> 
<style> 
    #capture{ 
     width: 200px; 
     height: 200px; 
     background-color: aqua; 
    } 
</style> 
</head> 

<body> 
    <div id="capture"></div> 
    <script src="index.js"></script> 
</body> 
</html>

index.js

var ele = document.getElementById("capture"); 
ele.onclick = function() { 
    console.log("click"); 
}

Hinweis: onload wird am häufigsten im Körper Element verwendet:

HTML-Code:

<html> 
<head> 
<title></title> 
<style> 
</style> 
</head> 
<body id="capture" > 
    <script src="index.js"></script> 
</body> 
</html>

index.js:

var ele = document.getElementById("capture"); 
ele.onload = function() { 
    console.log("load"); 
}

Quelle

2016-05-29 09:30:14 Ehsan

Ich habe versucht, es auf eine etwas andere Weise zu tun .. Hoffe es hilft.

INDEX.JS

$(document).ready(function(){ 
    console.log("Loaded"); 
    // var capture = document.getElementById("capture"); 
    $("#capture").click(function(){ 
     console.log("load"); 
     alert("Hello!"); 
    }); 
});

IHRE HTML

<html> 
    <head> 
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"> 
    <h1>McMac editing</h1> 
    <meta charset="utf-8"> 
    <script src="bower_components/jquery/dist/jquery.js"></script> 

    <script src="index.js"></script> 
    </head> 
    <body ng-app=""> 
      <div id="capture" style="width:100px;height:100px; background-color:#ddd;padding:2; text-align:center; font-weight:bold;"> 
     Click Here For External JS function Trigger. 
     </div> 
    </body> 
</html>

ich Bower bin mit damit der Weg für jquery ist von Bower Komponenten.

Quelle

2016-05-29 09:19:17

Ich denke, es wäre einfacher, eine schnelle Lösung zu bekommen, wenn Sie den HTML-Teil zeigen, wo "Capture" definiert ist. Ihre JavaScript-Code-Deklaration in Ihrer index.js ist korrekt, je nachdem, was in Ihrem HTML-Code ist.

Dinge zu beachten:

1) Ihre index.js im selben Ordner Ihre HTML-Datei Witz sein sollte.

2) In Ihrer index.js deklarieren Sie 'var capture = document.getElementById (' capture ');', daher sollte 'capture' eine ID eines Elements in Ihrem HTML-Code sein.

3) Sie verwenden das Onload-Ereignis hier. Onload wird normalerweise mit dem Element 'body' verwendet, um ein Skript auszuführen, sobald eine Webseite den gesamten Inhalt vollständig geladen hat.

Wenn Capture also keine ID Ihres HTML-Body-Elements ist, dann sehen Sie wahrscheinlich nichts in Ihrer Konsole. Bitte zeigen Sie Ihren HTML-Code, wenn Sie eine spezifischere Antwort benötigen.

Ich hoffe, das würde helfen.

Quelle

2016-05-29 09:52:58 ojasseh

Sie versuchen, „Capture“ Element zuzugreifen, die nicht geladen wurde, wenn man es aus dom bekommen soll durch diesen Code mit var capture = document.getElementById("capture"); .In rechts nächste Anweisung Sie capture.onload = function(){} geschrieben haben, .dass Fehler folgende Konsole verursacht, weil Browser nicht tat Finden Sie zu diesem Zeitpunkt ein beliebiges Element mit dem Namen "capture", so dass es ein Null-Objekt an capture zurückgibt.

Kann nicht Eigentum 'onload' von null gesetzt

Sie haben zwei Möglichkeiten, es zu beheben

1. Last index.js nach Körperelement

<html> 
. 
. 
</body> 
<script src="index.js" type="text/javascript"></script> 
</html>

2. Warten Sie, bis alle body-Elemente in dom geladen sind (ohne JQuery zu verwenden)

document.addEventListener("DOMContentLoaded", function(event) 
{ 
     //Your code 
     var capture = document.getElementById("capture"); 
     capture.onload = function() 
     { 
      console.log="load"; 
     }; 
}

Quelle

2016-05-29 10:15:23

Trigger js Ereignisse wie onclick von einer externen js Datei

Antwort

Verwandte Themen