JS |使用Onclick加載不起作用 - 快速解決方案？

問題可能出在兩個事件：onload,onclick（事件onload確實有效，但onclick沒有）。我怎樣才能以最好的方式解決這個問題，以保持其中的兩個在相同的代碼中運行？感謝您的任何建議。JS |使用Onclick加載不起作用 - 快速解決方案？

const vacationPlaces = ['Praha','Vien','Munich']; 
 

 
function backwards() { 
 
for (let vacationSpotIndex = vacationPlaces.length - 1; vacationSpotIndex >= 0; vacationSpotIndex--) { 
 
    let showPlaces = vacationPlaces[vacationSpotIndex] + ", "; 
 
    let removeComma = showPlaces; 
 
    document.getElementById("resultMonthly").innerHTML += removeComma; 
 
} 
 
} 
 

 
function forwards() { 
 
for (let i = 0; i < vacationPlaces.length; i++) { 
 
    document.getElementById("resultDaily").innerHTML += vacationPlaces[i] + ", "; 
 
} 
 
} 
 

 

 

 
function all() { 
 
    backwards(); 
 
    forwards(); 
 
} 
 

 
function click() { 
 
    document.getElementById("resultHourly").innerHTML = "hi"; 
 
}

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     
 
     <meta charset="utf-8"> 
 
     <title>Issue App</title> 
 
     <link rel="stylesheet" type="text/css" href="wageup.css"> 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
     
 
    </head> 
 
    <body onload="all()"> 
 
    <div class="container"> 
 
     <h2>for loop</h2> 
 
     
 
     <div class="alert alert-success" role="alert" id="resultMonthly"> 
 
     </div> 
 
     <div class="alert alert-info" role="alert" id="resultDaily"> 
 
     </div> 
 
     <div onclick="click()" class="alert alert-warning" role="alert" id="resultHourly"> 
 
     </div> 
 
     </div> 
 

 
     
 
     
 
       
 
     <!-- Scripts --> 
 
     
 
     <script src="http://chancejs.com/chance.min.js"></script> 
 
     <!-- Jquery --> 
 
     <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> 
 
     <!-- Bootstrap --> 
 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
     <!-- JS --> 
 
     <script type="text/javascript" src="forloop.js"></script> 
 
     
 
    </body> 
 
</html>

來源

2017-10-07 Adam

在onclick屬性的上下文中，功能click是本機函數。所以你的點擊處理程序正在工作，但它調用內置的click函數，而不是你的點擊功能。你可以通過重命名該函數來解決這個問題。例如，我把它命名爲showAlert：

const vacationPlaces = ['Praha','Vien','Munich']; 
 

 
function backwards() { 
 
    for (let vacationSpotIndex = vacationPlaces.length - 1; vacationSpotIndex >= 0; vacationSpotIndex--) { 
 
    let showPlaces = vacationPlaces[vacationSpotIndex] + ", "; 
 
    let removeComma = showPlaces; 
 
    document.getElementById("resultMonthly").innerHTML += removeComma; 
 
    } 
 
} 
 

 
function forwards() { 
 
    for (let i = 0; i < vacationPlaces.length; i++) { 
 
    document.getElementById("resultDaily").innerHTML += vacationPlaces[i] + ", "; 
 
    } 
 
} 
 

 
function all() { 
 
    backwards(); 
 
    forwards(); 
 
} 
 

 
function showAlert() { 
 
    console.log('clicked') 
 
    document.getElementById("resultHourly").innerHTML = "hi"; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>Issue App</title> 
 
    <link rel="stylesheet" type="text/css" href="wageup.css"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"crossorigin="anonymous"> 
 

 
    <!-- Scripts --> 
 
    <script src="http://chancejs.com/chance.min.js"></script> 
 
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
    <!-- <script type="text/javascript" src="forloop.js"></script> --> 
 
</head> 
 

 
<body onload="all()"> 
 
    <div class="container"> 
 
    <h2>for loop</h2> 
 

 
    <div class="alert alert-success" role="alert" id="resultMonthly"></div> 
 
    <div class="alert alert-info" role="alert" id="resultDaily"></div> 
 
    <div onclick="showAlert()" class="alert alert-warning" role="alert" id="resultHourly"></div> 
 
    </div> 
 
</body> 
 
</html>

來源

2017-10-07 16:43:09 Sidney

稍有不慎會導致無用的代碼。感謝您發現函數的名稱是一個不同的內置函數。仍在學習：） – Adam

JS |使用Onclick加載不起作用 - 快速解決方案？

回答

相關問題