Webmaster Forum

Go Back   Webmaster Forum > Web Development > Coding Forum

Coding Forum Problems with your code? Discuss coding issues, including JavaScript, PHP & MySQL, HTML & CSS, Flash & ActionScript, and more.


Reply
 
Thread Tools Display Modes
Share |
  #1  
Old 05-17-2018, 06:02 AM
sstoney200's Avatar
sstoney200 sstoney200 is offline
Contributing Member
 
Join Date: 12-03-10
Location: Essex, UK
Posts: 279
iTrader: 0 / 0%
onclick function not working in innerHTML

I have an created a page, that after 5 seconds of inactivity fires a external HTML video loop page via the innerHTML function.

When user resumes activity via mousemove or mousedown I am then replacing the video page using the innerHTML to output back to home page.

The video loop after inactivity and reloading of page work absolutely fine.

Here is a working https://jsfiddle.net/ssoney200/fs68tqzk/1/

This issue I have is with an onclick function no longer working within the dynamically output innerHTML.

I am trying to use the following code to swap the display styles of both the 'home' and 'smartfm' divs on the click of 'smart-fm-btn'. This works fine if I code it in page naturally but fails when outputting dynamically via the innerHTML.

If somebody could please share some input in to what I might be doing wrong here I would be eternally grateful. I have been trying to get this to work for past 2 days! :/





Code:
var timeoutID; function setup() { this.addEventListener("mousemove", resetTimer, false); this.addEventListener("mousedown", resetTimer, false); this.addEventListener("keypress", resetTimer, false); this.addEventListener("DOMMouseScroll", resetTimer, false); this.addEventListener("mousewheel", resetTimer, false); this.addEventListener("touchmove", resetTimer, false); this.addEventListener("MSPointerMove", resetTimer, false); startTimer(); } setup(); function startTimer() { // wait 5 seconds before calling goInactive timeoutID = window.setTimeout(goInactive, 5000); } function resetTimer(e) { window.clearTimeout(timeoutID); goActive(); } function goInactive() { document.getElementById("content").innerHTML="<object type='text/html' data='http://bubbleweb.eu/sp-interactive/video.html' ></object>"; } function goActive() { document.getElementById("content").innerHTML='<div id="home" style="text-align:center; display:block"><img class="logo" src="http://bubbleweb.eu/sp-interactive/images/logo.jpg" /><a class="button" href=""><img src="http://bubbleweb.eu/sp-interactive/images/one-spie.jpg" /></a><a onclick="smart_fm_btn()" class="button" href="#"><img src="http://bubbleweb.eu/sp-interactive/images/smart-fm.jpg" /></a><a class="button" href=""><img src="http://bubbleweb.eu/sp-interactive/images/who-we-are.jpg" /></a></div><div onclick="smart_fm_btn()" style="text-align:center; display:none"><img class="nav" src="http://bubbleweb.eu/sp-interactive/images/nav.jpg" /><img class="logo-inner" src="http://bubbleweb.eu/sp-interactive/images/logo.jpg" /><div class="left"><a id="enegyModal" href="#"><img class="nav" src="http://bubbleweb.eu/sp-interactive/images/energy.jpg" /></a></div><div class="right"><img class="nav" src="http://bubbleweb.eu/sp-interactive/images/predictive.jpg" /></div><div id="myModal" class="modal"><!-- Modal content --><div class="modal-content"><span class="close">&times;</span><p>Test the Modal..</p></div>' startTimer(); } ////////// Smart button working, but not dynamically in innerHTML ////////// function smart_fm_btn() { var x = document.getElementById("smartfm"); if (x.style.display === "none") { x.style.display = "block"; } else { x.style.display = "none"; } var y = document.getElementById("home"); if (y.style.display === "block") { y.style.display = "none"; } else { y.style.display = "block"; } }



HTML Code:
<div class="container"> <div id="content" class="content"> </div> </div>
 
Reply With Quote

Advertisement

Advertisement

Go Back   Webmaster Forum > Web Development > Coding Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Why my wordpress Signup form not working? telugulyrics Blogging Forum 1 05-02-2018 11:43 PM
Htaccess Not Working After SSL Techmate001 SEO Forum 3 04-04-2017 04:18 AM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 09:32 PM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2018 VIX-WomensForum LLC