Seemingly Simple - If Else Statement

**sg-phnick** · Apr 5, 2011 10:02

Hello, I am trying to setup a simple "If Else" statement to display a certain div based on a string in the URL.

So if the url is domain.com/source1 display only source1 div
If the url is domain.com/source2 display only source2 div

This is what I have tried to at least show or hide based on one source.. haven't gotten to multiples yet!

Code JavaScript:

<script type="text/javascript">
if(document.URL.indexOf("source1") >= 0){
    document.getElementById('source1').style.display = "block";
 
} else 
    document.getElementById('source1').style.display = "none";
 
}
</script>

This is the HTML

Code HTML4Strict:

 
<style type="text/css">
 .show {display: block; }
</style>
 
<div id="source1" class="show">content for source one div....
</div>

Thank you very much in advance for any help you can provide. I have carefully searched this and many other forums to find an answer.

**oddz** · Apr 5, 2011 11:12

missing { after else.

**AllanP** · Apr 14, 2011 00:38

You need to look at the document's location.href to determine if it is source1 or source2. The following script displays one of two divs with the words Source1 or Source2, depending on the location.href value.

Code :

<!doctype HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Loction Object</title>
<script type="text/javascript">
<!--
var s1=document.location.href.indexOf("source1");
if(s1 != -1){s1=true;}
window.onload=function()
 { if(s1==true)
    { document.getElementById("source1").style.display="block"; }
   else
    {  document.getElementById("source2").style.display="block"; }
  }
//-->
</script>
<style type="text/css">
<!--
body     { font-family:arial, helvetica, sans-serif; font-size:18px; font-weight:bold; color:#000080; text-align: center; margin-top:3px; margin-left:0px; }
#wrap    { position:relative; top:0px; left:0px; width:500px; height:500px; margin:10px auto; border:1px solid #CCC;  }
#source1, #source2 { display:none; position:absolute; top:20px; left:20px; width:300px; height:300px; background-color:#FFF; text-align:left;  }
-->
</style>
</head>
 
<body>
 
<div id="wrap">
  <div id="source1">
    Source1
  </div>
  <div id="source2">
    Source2
  </div>
</div>
<!-- end wrap -->
 
</body>
 
</html>

User Tag List

Thread: Seemingly Simple - If Else Statement

Thread Tools

Display

Seemingly Simple - If Else Statement

Bookmarks

Bookmarks

Posting Permissions