JS help requested please - W3 validation fail...

Merlin

Expert Member
Joined
Jan 18, 2006
Messages
2,789
Reaction score
319
Location
Cape Town, South Africa
Hi all,

I'm at the last error before my new 'site can get W3 XHTML 1.0 Strict validation.

My index page calls an include, part of which puts this into the head section:

----------------------------------------------------------------------------------------------------

echo <<<SCRIPT
<script type="text/javascript">
function decodeaddr(protectedaddr, domid, textafterhover){
var cleanAddr='';
for(i=0; i < cleanaddr.length+1; i+=2){
thisPiece=protectedaddr.substring(i,i+2);
cleanaddr=cleanaddr.concat(thisPiece.charAt(1), thisPiece.charAt(0));
}
if(textafterhover == 'decode'){
textafterhover = cleanaddr;
}
cleanaddr=textafterhover.link('mailto:'+cleanaddr);
document.getelementbyid(domid).innerhtml=cleanaddr;
}
</script>

SCRIPT;

----------------------------------------------------------------------------------------------------

It is failing on the Less Than sign here:

for(i=0; i < cleanaddr.length+1; i+=2){

I have tried changing it to a &lt; and have also tried escaping it with a \ as recommended by the validator.

What else can I try please?

Thanks, Nic
 
Hi m_s,

Just tried adding a = behind the < and the script fails. :(

The two errors thrown up by the validator are:

# Warning Line 75, Column 13: character "<" is the first character of a delimiter but occurred as data

...and:

# Error Line 75, Column 13: StartTag: invalid element name

for(i=0; i < cleanAddr.length+1; i+=2){

Any other ideas? :(

Thanks, Nic
 
If I remember correctly (and as it turns out, I do :p), you should encapsulate the script in <=!=[=C=D=A=T=A=[]=]=> tags, like so:

Code:
<script type="text/javascript">
<=!=[=C=D=A=T=A=[
function decodeaddr(protectedaddr, domid, textafterhover){
...
}
]=]=>
</script>

http://javascript.about.com/library/blxhtml.htm

Hey Raithlin,

Thanks for the reply.

I had forgotten about CDATA - I've just fixed another bit of JS on my 'site thanks to your tip.

...BUT, it bombs when I apply it to my script. :(

This JS is inserted via a PHP include, but it looks right to me when I view the source.

Any other ideas?

Thanks, Nic
 
When you declare your variable, you're using camel case (cleanAddr) ...elsewhere not.

Doh!

PS. I just chucked your code in here: http://www.jslint.com/ to figure that out. Handy piece of tool that.
 
Last edited:
When you declare your variable, you're using camel case (cleanAddr) ...elsewhere not.

Doh!

PS. I just chucked your code in here: http://www.jslint.com/ to figure that out. Handy piece of tool that.

:D Well spotted! However, upon closer inspection, should you not be checking against protectedaddr.length? cleanaddr.length will always be 0 (when not undefined, that is :D).
 
When you declare your variable, you're using camel case (cleanAddr) ...elsewhere not.

Doh!

PS. I just chucked your code in here: http://www.jslint.com/ to figure that out. Handy piece of tool that.

I can also "Doh!" - that was copied from an experiment of mine where I was trying to fix another error. ;)

Code:
<?php
/***********************************************************************************************
HideAddress 0.24 --> monsterbyte.com [licensed under the GNU/GPL]
   written by Geoffrey Mathews
Function email() scrambles email addresses to be descrambled by javascript function decodeAddr()
   and displayed in page onMouseOver [hover]
include this file in your page.php files using something like
   <?php
   include_once $_SERVER['DOCUMENT_ROOT']."/php/hideaddr.php";
   ?>
usage: <?php email("[email protected]", "text to display before hover", "text to display after hover"); ?>
compatibility: NS6+, IE5+, Mozilla, etc. -- [requires support for getElementById()]
***********************************************************************************************/

function email($cleanAddr, $textToDisplay='[protected e-mail]', $textAfterHover = null){
   
   // show link as italicized?
   $italicize = true;
   
   if($italicize){
     $textToDisplay = "$textToDisplay";
   }
   // if $cleanAddr is an array, this function is a callback on replacement -- assumed
   if(is_array($cleanAddr)){
	 $cleanAddr = $cleanAddr[0];
	 $returnWithoutEcho = TRUE;
   }
   else $returnWithoutEcho = FALSE;
   
   if(!isset($textAfterHover)){
     $textAfterHover = 'decode';
   }
   // scramble $cleanAddr, echo $protectedAddr [as a clickable DIV element] and then return true
   $protectedAddr = $cleanAddr;
   $protectedAddr = chunk_split($protectedAddr, 2, '|');
   $flipArray = explode('|',$protectedAddr);
   if(strlen($cleanAddr)%2==0){ // if even number of letters in addr
      $numPairs = strlen($cleanAddr)/2;
   }
   else $numPairs = (strlen($cleanAddr)+1)/2; // odd num. of ltrs. in addr.
   $protectedAddr = '';
   for($i=0; $i<$numPairs; $i++){    
      $protectedAddr .= strrev($flipArray[$i]);
   }
   
   // create DOM id for this mail addr. [strip '.' and '@' => 1st 8 chars]
   $badChars = array("@",".","-","_");
   $domId = substr(str_replace($badChars, "", $protectedAddr), 0, 8).rand(1000,9999);
   
   $replacementString = <<<MAILLINK
<span id="$domId" class="maintext"><span onmouseover="decodeAddr('$protectedAddr', '$domId', '$textAfterHover')"><a href="">$textToDisplay</a></span></span>

MAILLINK;
   if(!$returnWithoutEcho){
     // output the span element with javascript action
     echo $replacementString;
     return true;
   }
   else{
     return $replacementString;
   }
}

// print the javascript descrambling function
echo <<<SCRIPT
<script type="text/javascript">
	function decodeAddr(protectedAddr, domId, textAfterHover){
	var cleanAddr='';
	for(i=0; i < cleanAddr.length+1; i+=2){
	thisPiece=protectedAddr.substring(i,i+2);
	cleanAddr=cleanAddr.concat(thisPiece.charAt(1), thisPiece.charAt(0));
	}
	if(textAfterHover == 'decode'){
	textAfterHover = cleanAddr;
	}
	cleanAddr=textAfterHover.link('mailto:'+cleanAddr);
	document.getElementById(domId).innerHTML=cleanAddr;
	}
	</script>

SCRIPT;
?>

There is the full code ^.

...plus some activation code in my page:

Code:
<?php email("[email protected]"); ?>

It is a pre-built email obfuscation script.

It basically shows 'protected email' on the page until you hover over it at which point it reveals the email address.

I'm just an amateur JS tinkerer. ;)

When I say it bombs, I mean it fails to show the email addy when I add the CDATA tags.

As it is above it works 100%.

Cheers, Nic
 
Firebug :confused:

I didn't know there were still people not using it :wtf:

Good for fixing/hacking/checking/etc. combined with tamper data that is.
 
Just Googled "Firebug" - will check it out thanks.

Tamper data?

Well I use Firebug more for editing my web-pages and seeing the effect immediately. But it helps when debugging JS, other than that the Error Console in Firefox is also helpful.

Tamper data is also a plug-in for Firefox (like firebug). I use it for security analysis, using Firebug I can easily disable JS validation and such and change AJAX queries in order to test security but when there is a submit on a web-site it helps having tamper data. It allows me to change the http submit before the actual submission is complete. Once again for security analysis. A few years back web-site security was all about the SQL injection, these days I encounter far more web-sites that use only client side validation (IE. they validate the data using JS client side which is useless), second to that is AJAX. Many web-sites lack security when it comes to AJAX and the worst is http submit, the amount of web-sites with problems in that area you would not believe. Let's just say I've had access to systems that contain very confidential data, and it's large institutions because of these problems.

Anyway point being they are essential tools for REAL server-side developers :p Hell any serious web-site designer at that. I cannot image doing HTML without Firebug anymore, it is far too tedious.
 
Last edited:
Top
Sign up to the MyBroadband newsletter
X