asked on

Issue with <a href='#' onclick=callfunction()>Click me!</a>

Alright, I'm not really sure if I'm doing any of this the right way but here's what I've done...

I've created an AJAX web page and would like to use regular <a> links as the controls to modify the data on the page. I can do this by using
<a href='#' onclick='callfunction()'>Click me!</a>

Only problem is because I have the '#' symbol for the href it pops me back up to the top of the page. If I take the '#' out of the href then the onclick function does not get called.

What I'm looking for is a way to use <a> tags to call an onclick javascript function without distruption page orientation.

If I use buttons to do this
<input type='button' value='Click me' onclick='callfunction()'>

It works exactly how I'd like it to, minus the buttons look completely out of place with the rest of the site.

Any ideas?

kasualcom

ASKER

Ok, I spoke to soon, I can get it to work, but now my only problem is my css code for <a> tags does not apply to it any thoughts on that?

To get it to work I took out the href='' completely.

karlsfre

Just a few quick questions:

What does your CSS like?
Does the CSS style get applied for other <a> tags on the page?
What browser do you use?

kasualcom

ASKER

CSS:

a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
text-decoration: underline;
color: #00AA21
}
a:active {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-decoration: none;
color: #00AA21
}
a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
text-decoration: underline;
color: #00AA21
}
a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-decoration: none;
color: #00AA21
}

It does work for the other <a> tags

I'm currently using FireFox 2.0

ASKER CERTIFIED SOLUTION

karlsfre

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

rockymagee

If you copy and paste this into a balnk .htm or whatever page it seems to work fine:

<style type="text/css">

</style>

<body>
<a href='#' onclick='callfunction()'>Click me!</a>
</body>

rockymagee

As far as not disrupting the page orientation I think you are going to have to submit the function via a form like so:

<form action="#" onsubmit="callfunction()">

</form>

Be sure to put the <form> tags outside on any table rows if you are using HTML table tags ...

kasualcom

ASKER

Thanks a lot , it does exactly what I'd like it to do, and very very simply.

Issue with &lt;a href='#' onclick=callfunction()&gt;Click me!&lt;/a&gt;

Issue with <a href='#' onclick=callfunction()>Click me!</a>