944,164 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > please help onClick js code
Ad:
Permalink
Nov 4th, 2009
0

please help onClick js code

Expand Post »
hello, i'm a student trying create a website using javascript. i am not familiar with javascript and i must use it to change only the content on my page. i have been stuck on this for days and i just cannot get it right.

using the 960 grid on the website what is the code to remove the behavior of my sidebar links?

also how do i add an onClick feature to my sidebar links?

the last question i have is. what is the correct code to change only the content of the page while everything else remains the same??

This is my html for the side bar and content div.


JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <!--HOT RODS LINKS -->
  2.  
  3. <div class="grid_3" id="car_links">
  4.    <script type="text/javascript" src="js/hotrods.js">
  5.     <ul>
  6. 	<li ><a href="#">Famous Hot Rods</a></li>
  7.     <li><a href="#">Electric Cars</a></li>
  8.     <li ><a href="#">Pre World War II</a></li>
  9.    </script>   
  10.  
  11. </ul>
  12. </div>
  13. <!--CONTENT -->
  14.  
  15.  
  16. <div class="grid_8" id="content"> 
  17.  
  18. <p>Click On list for Hot Rod List for details. </p>
  19.  <p id="text1"> 
  20.  </p>
  21.  
  22.  
  23.  
  24.  
  25.    </div>   
  26.  
  27.         <div class="clear"></div>
Last edited by Ezzaral; Nov 4th, 2009 at 12:27 pm. Reason: Added [code] [/code] tags. Please use them to format any code that you post.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
dmmajorstudent is offline Offline
15 posts
since Nov 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
hello, i'm a student trying create a website using javascript. i am not familiar with javascript and i must use it to change only the content on my page. i have been stuck on this for days and i just cannot get it right.
a good place to learn javascript is w3schools
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
using the 960 grid on the website what is the code to remove the behavior of my sidebar links?
I have no idea what this means
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
also how do i add an onClick feature to my sidebar links?
you add an onclick event like this:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <a onlick="somejsfunction()">click here</a>
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
the last question i have is. what is the correct code to change only the content of the page while everything else remains the same??
for this you will use ajax, which you can also learn at w3schools here
Reputation Points: 36
Solved Threads: 57
Posting Whiz
Thirusha is offline Offline
355 posts
since Mar 2008
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
Click to Expand / Collapse  Quote originally posted by Thirusha ...
a good place to learn javascript is w3schools

I have no idea what this means

you add an onclick event like this:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <a onlick="somejsfunction()">click here</a>

for this you will use ajax, which you can also learn at w3schools here



I've tried using w3 schools. been doing it for the last couple days and every time i go back and reedit the coding i cannot get it to work. its very frustrating. i've been trying to use documentwrite and getElementById.
what is the code to change content within my content div?
Reputation Points: 10
Solved Threads: 0
Newbie Poster
dmmajorstudent is offline Offline
15 posts
since Nov 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
if you want to change only a part of the text from inside of your website try something like this:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. function change_content()
  2. {
  3. document.getElementById('content').innerHTML='the new text';
  4. }



and you call this function on a onclick envent... something like:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <div id='content' onclick='change_content()'>click here</div>
i didn't understand exactly what you want... this is what i understood
Reputation Points: 10
Solved Threads: 2
Newbie Poster
futingkiller is offline Offline
17 posts
since Oct 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
ah sorry i wasn't clear. using an onClick code. i wanted to know what the javascript code is so that any time i click on the links below only the content in the . w3 schools isn't helping me that much and neither is the book i have. i have never used javascript before.

<div class="grid_8" id="content"> would change.


so within these links. i would have paragraphs of different information in each link. the famous hot rods links would have its own information and electric cars...
html Syntax (Toggle Plain Text)
  1. <li ><a href="#">Famous Hot Rods</a></li>
  2. <li><a href="#">Electric Cars</a></li>
  3. <li ><a href="#">Pre World War II</a></li>
  4. </script>
Last edited by peter_budo; Nov 5th, 2009 at 7:07 pm. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks)
Reputation Points: 10
Solved Threads: 0
Newbie Poster
dmmajorstudent is offline Offline
15 posts
since Nov 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
ah sorry i wasn't clear. using an onClick code. i wanted to know what the javascript code is so that any time i click on the links below only the content in the . w3 schools isn't helping me that much and neither is the book i have. i have never used javascript before.

<div class="grid_8" id="content"> would change.


so within these links. i would have paragraphs of different information in each link. the famous hot rods links would have its own information and electric cars...
<li ><a href="#">Famous Hot Rods</a></li>
#
<li><a href="#">Electric Cars</a></li>
#
<li ><a href="#">Pre World War II</a></li>
#
</script>
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <li ><a href="javascript:change_content('Famous Hot ROds');">Famous Hot Rods</a></li>
  2.  
  3. <li><a href="javascript:change_content('electric cars');">Electric Cars</a></li>
  4.  
  5. <li ><a href="javascript:change_content('pre ww2');">Pre World War II</a></li>
and the function is:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. function change_content(a)
  2. {
  3. document.getElementById('content').innerHTML=a;
  4. }
this script changes the content in the div that has the ID "content" into what he receives in the function: change_content('pre ww2'); when you click the links
if you want to write something diferent, change the
document.getElementById('content').innerHTML=a; into something diferent.
hope you understood
Reputation Points: 10
Solved Threads: 2
Newbie Poster
futingkiller is offline Offline
17 posts
since Oct 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
thanks alot. this is starting to help me. now without using inner html. how do i add in specific paragraphs of information to these assigned links. like lets take famous cars for example.. and i write all this information about it. in javascript without using innerhtml how do i change the content and place it into the content div every time i click on one of those links?
Reputation Points: 10
Solved Threads: 0
Newbie Poster
dmmajorstudent is offline Offline
15 posts
since Nov 2009
Permalink
Nov 4th, 2009
0
Re: please help onClick js code
Click to Expand / Collapse  Quote originally posted by dmmajorstudent ...
thanks alot. this is starting to help me. now without using inner html. how do i add in specific paragraphs of information to these assigned links. like lets take famous cars for example.. and i write all this information about it. in javascript without using innerhtml how do i change the content and place it into the content div every time i click on one of those links?
there is nothing wrong with using innerHTML (btw it's case sensitive).
you can make a function that receives the #number of the link he clicked and check which one was clicked and put the text in the div according to the link that was clicked...
from what i know that is the only way to change what the div contains.... you can put any HTML code inside that div, and the browser will interpret it. for example:
document.getElementById('content').innerHTML="<table><tr><td> first tab </td></tr></table>"
if you are happy with my help mark this treath as solved
Reputation Points: 10
Solved Threads: 2
Newbie Poster
futingkiller is offline Offline
17 posts
since Oct 2009

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Textbox validate
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: onClick code dont now how to use.





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC