2017-03-11 3 views
0

JsとPythonを使用する独自の作成されたキャプチャ機能があります。ユーザーが答えなければならない謎です。 これは非常にうまくいったが、ユーザーが自分の質問に答えることができない場合は、手がかりを追加したかった。そこで別のファイルを追加しました。これもうまくいきます。しかし、その後、私のjavascriptは、python-serverとの通信を完全に止めてしまいました。 window.onloadは実行さえしません。しかし、ファイルには正しいものが含まれています。なぜなら、console.log(「何でも」)窓の外に出ると、それが印刷されます。別のファイルを含むとJavaScriptファイルが機能しなくなる

HEADERのHTML(二最後に失敗しているを含む)

<head> 
<meta charset="UTF-8"> 
<title>Kristoffer Karlsson</title> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" 
     integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
<link rel="stylesheet" href="css/myCSS/myStyle.css"> 
<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" 
     integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" 
     integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" 
     crossorigin="anonymous"></script> 

<script src="js/myJs/smoothScroll.js"></script> 
<script src="js/jquery.touchSwipe.js"></script> 
<script src="js/myJs/swipe.js"></script> 
<script src="js/myJs/showContacts.js"></script> 
<script src="js/myJs/showClue.js"></script> 

window.onload = function() { 
 
    var form = document.getElementById("jokeForm"); 
 
    console.log("contacts"); 
 
    form.onsubmit = callServer; 
 
}; 
 

 

 
function callServer() { 
 
    var answer = document.getElementById("answerField").value; 
 
    console.log(answer); 
 
    $.ajax({ 
 
     type: "GET", 
 
     url: "http://localhost:3000/checkAnswer/"+ answer, 
 
     success: checkAnswer 
 
    }); 
 
    return false; 
 
} 
 

 
function checkAnswer(respons) { 
 
    console.log(respons) 
 
    if(respons == "wrong"){ 
 
     return false; 
 
    }else { 
 
     addContacts(respons); 
 
    } 
 
} 
 

 
function addContacts(response) { 
 
    removeQuestion(); 
 
    var parent = document.getElementById("contactInfo"); 
 
    var email = document.createElement("H2"); 
 
    var phone = document.createElement("H3"); 
 
    email.textContent = response; 
 
    phone.textContent = "070-287 12 36"; 
 
    parent.appendChild(email); 
 
    parent.appendChild(phone); 
 
} 
 

 
function removeQuestion() { 
 
    var questionDiv = document.getElementById("jokeDiv"); 
 
    questionDiv.remove(); 
 
}

window.onload = function() { 
 
    var link = document.getElementById("giveClue"); 
 
    console.log("clue"); 
 
    link.onclick = showClue; 
 
}; 
 

 
function showClue() { 
 
    var link = document.getElementById("giveClue"); 
 
    link.style.display = "none"; 
 
    var parent = document.getElementById("jokeDiv"); 
 
    var paragraph = document.createElement("p"); 
 
    var clue = document.createTextNode("Nisse's father... who is Nisse?"); 
 
    paragraph.appendChild(clue); 
 
    parent.appendChild(paragraph); 
 
}

今のところ、python-communication javascriptは機能しません。ファイルがヘッダーに含まれる方法を変更すると、ファイルは機能しますが、手がかりファイルは変更されません。

+0

がhttp://mobile.htmlgoodies.comを参照してください、という形成アルを呼び出します/beyond/javascript/article.php/3724571/Using-Multiple-JavaScript-Onload-Functions.htmここで、onload関数が上書きされています。 –

答えて

0

私はwindow.onloadを使用して新しいファイルを追加することでこれを解決し、他の人からそれを削除した後、私は関数がメインjavascrpt

関連する問題