javascript - How to get onclick to work in edited innerHTML -
so in navigation javascript file, have this, has onclick event attribute load new page:
function navload() { // runs when load page. document.getelementbyid("main nav").innerhtml = '<table class = "navbar"><tr>'+ '<th onclick = "goto("main_page")"> home </th>'+ '<th onclick = "goto("archive")"> archive </th>'+ '<th onclick = "goto("about")"> </th>'+ '<th onclick = "goto("faq")"> faq </th>'+ '<th onclick = "goto("fanart")"> fanart! </th>'+ '</tr>'+ '<tr><td class = "spacer"></td></tr></table>'; } function goto(page) { window.location.assign(""+page+".html"); } and, html code uses looks this:
<html> <!-- stuff --> <body onload = "navload();"> <div id = "main"> <!-- stuff --> <script src = "htl_navigation_script.js"></script> <div id = "main nav" class = "comic"></div> <!-- other stuff --> </body></html> the navigation table displays correctly, link nothing when click on it! however, when put html seen in navload() function in html file, , import goto() method file, links work! wrong here?
you need make following correction in js file containing navload() method.change quotes double quotes(" ") single quotes(' '), in order have add escape character ('\') well.
function navload() { // runs when load page. document.getelementbyid("main nav").innerhtml = '<table class = "navbar"><tr>'+ '<th onclick = "goto(\'main_page\')"> home </th>'+ '<th onclick = "goto(\'archive\')"> archive </th>'+ '<th onclick = "goto(\'about\')"> </th>'+ '<th onclick = "goto(\'faq\')"> faq </th>'+ '<th onclick = "goto(\'fanart\')"> fanart! </th>'+ '</tr>'+ '<tr><td class = "spacer"></td></tr></table>'; } hope helps :)
Comments
Post a Comment