我如何從另一個js文件中調用函數
[英]how can i call a function from another js file
問題描述
測驗結束后如何在不單擊“結果”按鈕的情況下獲得相同的結果這是我嘗試過的操作
if (currentQuestion == totalQuestions) {
var outputDiv = document.getElementById("quizEnds");
outputDiv.innerHTML = "You have reached the final question.";
$('#next').remove();
getScore(this.form);
}
這是行不通的。 有人可以指出錯誤嗎？ 它必須是兩個分開的文件。 謝謝
//quizeffect.js var totalQuestions = $('.questions').size(); var currentQuestion = 0; $questions = $('.questions'); $questions.hide(); $($questions.get(currentQuestion)).fadeIn(); $('#next').click(function () { $($questions.get(currentQuestion)).fadeOut(function () { currentQuestion = currentQuestion + 1; if (currentQuestion == totalQuestions) { var outputDiv = document.getElementById("quizEnds"); outputDiv.innerHTML = "<h2>You have reached the final question.</h2>"; $('#next').remove(); getScore(this.form); } else { $($questions.get(currentQuestion)).fadeIn(); } }); }); //tlcquizzapp.js /*====================app js====================*/ var numberOfQuestions = 6; // Insert number of choices in each question var numberOfChoices = 4; var rightAnswers = 0; var correct = []; var wrong =[]; var answers = new Array("Double Parking", "The aplicant will have the aplication denied", "Never", "All of the above", "Yellow taxi medallion base", "You are allowed to pick up in the crosswalk if the passenger is standing at the intersection"); function print(message) { var outputDiv = document.getElementById("output"); outputDiv.innerHTML = message; } function buildList(arr) { var listHTML = '<ol>'; for (var i = 0; i < arr.length; i++) { listHTML += '<li>' + arr[i] + '</li>'; } listHTML += '</ol>'; return listHTML; } // Do not change anything below here ... function getScore(form) { var score = 0; var currElt; var currSelection; for (i = 0; i < numberOfQuestions; i++) { currElt = i * numberOfChoices; for (j = 0; j < numberOfChoices; j++) { currSelection = form.elements[currElt + j]; if (currSelection.checked) { if (currSelection.value == answers[i]) { score++; correct.push(currSelection.value); } else{ wrong.push(currSelection.value); } } } } score = Math.round(score/numberOfQuestions*100); var userAnswers = '<p>You got ' + score + ' % on your test.</p>'; userAnswers += '<h2>You got these answers correct:</h2>'; userAnswers += buildList(correct); userAnswers += '<h2>You got these answers wrong</h2>'; userAnswers += buildList(wrong); print(userAnswers); }
.questions p{ font-size: 24px; background-color: #3399FF; color: #FFF; padding: 20px; } .options li{ font-size: 18px; } form { width: 80%; margin: 0 auto; border: 1px solid #DDD; } button { border: none; padding: 10px; border-radius: 10px; background-color: #3399FF; color: #FFF; } button:hover { background-color: orange; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>TLC Driver Practice Quiz</title> <link rel="stylesheet" href="css/tlc-style.css"> </head> <body> <div><h1>TLC Practice Quiz</h1></div> <form> <div class="questions"> <p>1. Which of the following is not a moving violation?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q1" value="Double Parking">Double Parking</li> <li><input class="option" type="radio" name="q1" value="Tailgating">Tailgating</li> <li><input class="option" type="radio" name="q1" value="Speeding">Speeding</li> <li><input class="option" type="radio" name="q1" value="Failing to signal a turn">Failing to signal a turn</li> </ol> </div> <div class="questions"> <p>2. What is the penalty for an aplicant of an TLC driver's license who test positive for drugs and fails the drug test?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q2" value="The aplicant must take the test again">The aplicant must take the test again</li> <li><input class="option" type="radio" name="q2" value="The aplicant will have a provationary license">The aplicant will have a provationary license</li><li><input class="option" type="radio" name="q2" value="The aplicant will have the aplication denied">The aplicant will have the aplication denied</li> <li><input class="option" type="radio" name="q2" value="The aplicant will have to drive carfolly">The aplicant will have to drive carfolly</li> </ol> </div> <div class="questions"> <p>3. In wich situation may you pass a school bus with the red flashing light on?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q3" value="When it is snowing">When it is snowing</li> <li><input class="option" type="radio" name="q3" value="When you do not see children around">When you do not see children around</li> <li><input class="option" type="radio" name="q3" value="When someon behind beeps the horn">When someon behind beeps the horn</li> <li><input class="option" type="radio" name="q3" value="Never">Never<br/> </ol> </div> <div class="questions"> <p>4. Wich of the following is a service animal?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q4" value="A seeing eye dog">A seeing eye dog</li> <li><input class="option" type="radio" name="q4" value="A guide dog">Aguide dog</li> <li><input class="option" type="radio" name="q4" value="A signal dog">A signal dog</li> <li><input class="option" type="radio" name="q4" value="All of the above">All of the above</li> </ol> </div> <div class="questions"> <p>5. Which of the following is not a For-Hire base?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q5" value="Yellow taxi medallion base">Yellow taxi medallion base</li> <li><input class="option" type="radio" name="q5" value="Black car base">Black car base</li> <li><input class="option" type="radio" name="q5" value="Livery car service base station">Livery car service base station</li> <li><input class="option" type="radio" name="q5" value="Luxury limousine base">Luxury limousine base</li> </ol> </div> <div class="questions"> <p>6. Wich of the following is not correct?</p> <ol type="A" class="options"> <li><input class="option" type="radio" name="q6" value="When you pick up a passenger, the vehicle should be 12 inches from yhe curb">When you pick up a passenger, the vehicle should be 12 inches from yhe curb</li> <li><input class="option" type="radio" name="q6" value="When you pick up a passenger, the vehicle should be parallel to the curb">When you pick up a passenger, the vehicle shouldbe parallel to the curb</li> <li><input class="option" type="radio" name="q6" value="If the passenger is waiting next to a car that is already parked, you should look for space within 100 ft.">If the passenger is waiting next to a car that is already parked, you should look for space within 100 ft.</li> <li><input class="option" type="radio" name="q6" value="You are allowed to pick up in the crosswalk if the passenger is standing at the intersection">You are allowed to pick up in the crosswalk if the passenger is standing at the intersection</li> </ol> </div> <div id="quizEnds"></div> <button type="button" name="nextButton" id='next' value="Next">Next</button> <button class="results" type="button" value="Results" onClick="getScore(this.form);">Results</button> <!-- <button type="reset" value="Clear Answers">Clear Answers</button> --> <div id="output"></div> </form> <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script type="text/javascript" src="js/tlcquizzapp.js"></script> <script type="text/javascript" src="js/quizeffect.js"></script> </body> </html>
3 個解決方案
解決方案1
1 2016-11-13 18:00:07
您需要將form元素傳遞給getScore()函數，但是this.form不代表代碼中該位置的form元素，因為它位於傳遞給$questions.get(currentQuestion)).fadeOut() 。 在這一點上， this是指問題要素。 而且，即使那時您對button元素都有引用，也無法從中獲取表單，因為該按鈕已從頁面中刪除。
你可以保持在一個變量，其中表單元素的引用this確實提到過的按鈕元素：
$('#next').click(function () {
var form = this.form;
然后在調用getScore()時使用它：
getScore(form);
解決方案2
1 2016-11-13 18:08:41
this是按鈕。 使用closest()遍歷它所在的表單
嘗試
getScore($(this).closest('form')[0]);
或者更簡單些，給表單一個ID
<form id="myForm>
並使用該ID來定位表單
getScore($('#myForm')[0]);
解決方案3
0 2016-11-13 17:58:32
在jQuery事件函數內部， 這是指事件連接到的元素。 因此，您需要引用document.form [0]或使用jQuery版本。
如何從另一個js文件中的角度表達式內調用函數
[英]How can I call a function inside an angular expression from another js file
我可以從另一個 file1.js 的文件 JavaScript 調用函數嗎？
[英]Can I call a function from a file JavaScript from another file1.js?
如何從一個QtScript .js文件調用另一個QtScript .js文件
[英]How can I call another QtScript .js file from one QtScript .js file
如何從同一控制器的另一個函數調用Sails.js控制器的函數？
[英]How can I call a Sails.js controller's function from another function of the same controller?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.