如何創建和使用EJS中的onclick函數

我正在嘗試製作一個瑣事遊戲。我想使它在哪裏你可以點擊一個答案，並創建一個邊框，並增加點變量如何創建和使用EJS中的onclick函數

這裏是整個頁面。

<% include ../partials/boilerplate %> 

<% var points = 0; 
correctAnswer = (num) => {  
    document.getElementById(`correctAnswer${i}`).style.border = "5px solid black"; 
    points+=1 
} %> 


<div class="triviaContainer"> 
    <h1>WELCOME TO TOP FACT </h1> 
    <% var i =0; data.forEach(question =>{ %> 
<div class="questionRow"> 
    <div> <%= question.question %></div> 
</div> 
<div class="questionRow1"> 
    <div class="correctAnswer<%= i+=1 %>" onclick= <%= correctAnswer(i) %> > A: <%= question.correct_answer %></div> 
    <div>B: <%= question.incorrect_answers[0].incorrect_answer %></div> 
</div> 
<div class="questionRow2"> 
    <div>C: <%= question.incorrect_answers[1].incorrect_answer %></div> 
    <div>D: <%= question.incorrect_answers[2].incorrect_answer %></div> 
</div> 


<% }) %> 
    </div>

我希望能夠使用此功能的onclick進入什麼質疑這是因爲在一個循環正在產生的問題，如上圖所示的參數。

<% var points = 0; 
correctAnswer = (num) => {  
    document.getElementById(`correctAnswer${i}`).style.border = "5px solid black"; 
    points+=1 
} %>

下面列出了嵌入式onclick代碼。

<div class="correctAnswer<%= i+=1 %>" onclick= <%= correctAnswer(i) %> > A: 
<%= question.correct_answer %></div>

我不斷收到在EJS

ReferenceError: /Users/jdiperi88/wdi/UNIT_02/projects/trivia/views/trivia/trivia-index.ejs:17 
    15|  </div> 
    16|  <div class="questionRow1"> 
>> 17|   <div class="correctAnswer<%= i+=1 %>" onclick= <%= correctAnswer(i) %> > A: <%= question.correct_answer %></div> 
    18|   <div>B: <%= question.incorrect_answers[0].incorrect_answer %></div> 
    19|  </div> 
    20|  <div class="questionRow2"> 

document is not defined 
    at correctAnswer (eval at compile (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:549:12), <anonymous>:24:9) 
    at data.forEach.question (eval at compile (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:549:12), <anonymous>:38:26) 
    at Array.forEach (native) 
    at eval (eval at compile (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:549:12), <anonymous>:30:23) 
    at returnedFn (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:580:17) 
    at tryHandleCache (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:223:34) 
    at View.exports.renderFile [as engine] (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/ejs/lib/ejs.js:437:10) 
    at View.render (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/express/lib/view.js:128:8) 
    at tryRender (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/express/lib/application.js:640:10) 
    at Function.render (/Users/jdiperi88/wdi/UNIT_02/projects/trivia/node_modules/express/lib/application.js:592:3)

什麼是解決這一問題的最佳方式這個錯誤？

來源

2017-08-06 jdip88

EJS只是在服務器端的JavaScript幫助下將視圖放在一起並呈現它（發送到瀏覽器）。除此之外，它沒有功能。你試圖實現的是<script>標籤中的JavaScript應該在客戶端做什麼。

像這樣（未經）：

<script> 
var points = 0; 
function correctAnswer(num){  
    document.getElementById(correctAnswer' + num).style.border = "5px solid black"; 
    points+=1; 
} 
</script>

來源

2017-08-06 14:10:44

如何創建和使用EJS中的onclick函數

回答

相關問題