 |
Using Links Instead Of Buttons..... |
 |
Member Login
Welcome
Welcome to the Zymic webmaster forums. Our forums are here to provide people the free ability to discuss a range of websites related topics such as design, development coding and marketing.
In order to post you will need to register for a zymic account or if you already have one simply login by using the form on the left.
 |
Zymic Webmaster Forums Web Design & DevelopmentClient Side ScriptingJavaScript |
 |
  |
 Mar 31 2010, 06:49 AM
Post
#1
|
|
 Member  Group: Members Posts: 64 Joined: 14-February 10 From: North West Ohio, USA Member No.: 130,625  |
I want to try an experiment using AJAX (I'm a first timer) but I want to use a link instead of a button. How do I do this???
I got this code from W3 schools AJAX example but couldn't figure out how to use a link.... CODE <html> <head> <script type="text/javascript"> function loadXMLDoc(url) { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET",url,false); xmlhttp.send(null); document.getElementById('test').innerHTML=xmlhttp.responseText; } </script> </head> <body> <div id="test"> <h2>Let AJAX change this text</h2> </div> <button type="button" onclick="loadXMLDoc('test1.html')">Click Me</button> <button type="button" onclick="loadXMLDoc('test2.html')">Click Me</button> </body> </html> Thanks in advance for your help...... |
 |
 
|
|
Jun 23 2010, 12:38 AM
Post
#2
|
|
|
Newbie Group: Members Posts: 9 Joined: 3-June 10 Member No.: 144,389 |
CODE <a href='#' onclick="loadXMLDoc('test1.html')" class='jv-button'>Click Me</a> If you mean that you want the link to look like a button, use css like (keeping in mind the values don't matter; this is just an example): CODE .jv-button {
display: block; width: auto; height: auto; padding: 4px; padding-left: 10px; padding-right: 10px; font-size: 2em; text-decoration: none; color: #000000; } |
|
|
|
|
May 27 2011, 02:53 AM
Post
#3
|
|
|
Newbie Group: Members Posts: 3 Joined: 27-May 11 Member No.: 191,938 |
QUOTE(aray92 @ Jun 23 2010, 12:38 AM)  CODE <a href='#' onclick="loadXMLDoc('test1.html')" class='jv-button'>Click Me</a> If you mean that you want the link to look like a button, use css like (keeping in mind the values don't matter; this is just an example): CODE .jv-button { display: block; width: auto; height: auto; padding: 4px; padding-left: 10px; padding-right: 10px; font-size: 2em; text-decoration: none; color: #000000; } CODE <a href='#' onclick="loadXMLDoc('test1.html'); return false;" class='jv-button'>Click Me</a> return false disables the page changing |
|
|
|
|
May 29 2011, 09:34 AM
Post
#4
|
|
 Newbie Group: Members Posts: 18 Joined: 25-July 10 Member No.: 150,506 |
You can just use the href java script:your_function_name(event)
As for making sure the page doesn't change add a parameter to your function called event or e and put e.preventDefault() or event.preventDefault(). Note that when you pass the event parameter in your link href you must use event  so href="java script:your_function('somepage', event);"
|
|
|
|
| |
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users) |
|
| 0 Members: | ||
|
Forum Jump |
|
| Lo-Fi Version | Time is now: 25th May 2013 - 02:17 PM |