www.webdeveloper.com
Results 1 to 5 of 5

Thread: 2 HTML pages with same Javascript code, but one works other one does not

  1. #1
    Join Date
    Jul 2013
    Posts
    6

    2 HTML pages with same Javascript code, but one works other one does not

    I have the following Javascript code on 2 HTML pages, they are popup windows from the main parent window.

    When the user selects a picture in one of the child windows it changes a variable and an image in the parent window.

    I have pages changepic1.html and changepic2.html.

    This is the code for changepic2.html which doesn't work, yet changepic1.html which works is exactly the except the 2s in the lines commented on are 1s.

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
    <meta charset="utf-8">
    
    <title>Select Image</title>
    
    <link rel="stylesheet"  href="select.css">
    
    <script>
    (function() {
       'use strict';
    
    function removeWindow(){
    
    if(window.name=='wxyz'){
      var pic=document.getElementById('thumbs').getElementsByTagName('img');
      var c=pic.length;
    
    while(--c>-1) {
    pic[c].onclick=function(){
     
       var nsrc=this.src;
    
       var nme=nme.replace(nme.substr(nme.lastIndexOf('.')),'');
    
       window.opener.document.getElementById('change2input').value=nme;  // the Id is ('change1input') in other page 
       window.opener.document.getElementById('c2-pic').src=nsrc;   // the Id is ('c1-pic') in other page
       window.opener.document.getElementById('c2-pic').style.display ='inline';  // the Id is ('c1-pic') in other page
       if (nme=='Clear') { window.opener.document.getElementById('c2-pic').style.display ='none'; } // the Id is ('c1-pic') in other page
       window.close();
      } 
     }
    
      var txt=document.createTextNode('close this window'); 
      var cl=document.createElement('h2');
          cl.setAttribute('id','wincl');
          cl.appendChild(txt);
    
      document.body.appendChild(cl);
    
    document.getElementById('wincl').onclick=function(){ window.close(); }
      }
     }
       window.addEventListener?
       window.addEventListener('load',removeWindow,false):
       window.attachEvent('onload',removeWindow);
             function closeme()
        {  
            window.close();
        }
        window.onblur=closeme;
    })();
    </script>
    
    </head>
    <body>
    
    <ul id="thumbs">
    
     <li><img src="redGround-1.png" ></li>
     <li><img src="yellowFlat-2.png" ></li>
     <li><img src="bigCurve-3.png" ></li>
     <li><img src="smallCurve-4.png" ></li>
     
    </body>
    change1input and change2input are hidden input fields in the parent window and both exist.

    c1-pic and c2-pic are the div ids of the image to change in the parent window.

    This window doesn't close when the image is clicked, but the other page works fine.

    I have narrowed it down and the code stops at this line:

    Code:
    window.opener.document.getElementById('c2-pic').src=nsrc;
    If I change the image element ID to ('c1-pic') it changes the first image, but will not change the image with the ID ('c2-pic') with this code.

    Both images with ID c1-pic and c2-pic image exist.

    I am really puzzled why the page that changes pic 1 works but this page that changes pic 2 doesn't, when they have the exact same code?

  2. #2
    Join Date
    Jul 2013
    Posts
    24
    Wierd worked for me just fine

  3. #3
    Join Date
    Jul 2013
    Posts
    6
    Thank you for the reply Shawn, for me both the changepic1.html and changepic2.html child windows open from within the parent window,

    but when an image is clicked on the changepic1.html page it changes the variable and image in the parent window, and then close down changepic1.html.

    when an image within changepic2.html is clicked nothing changes in the parent window, and changepic2.html window does not close down.

    And really unsure why this is?

  4. #4
    Join Date
    Jul 2013
    Posts
    24
    That is indeed very peculiar. I wish I could help nut since I'm havimg no issue its hard to debug. I'd say try a different browser then work from there

  5. #5
    Join Date
    Jun 2008
    Posts
    106
    What does your error console say?

    Also, what is nme? It seems you use .replace() on it but it was never defined.
    Code:
    var nme = nme.replace(nme.substr(nme.lastIndexOf('.')), '');

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles