Why doesn't this Javascript function work?

Question

i would like to be able to click a link and have a form show up. ideally with smoothly maybe use delay? so far i click on the link and nothing happens.

My Javascript

<script type="text/javascript">
    function showForm() {
        document.getElementById('showme').style.display = "block";
    }
    </script>

my HTML

<a class="non_link" href="" alt="start a new post" onmouseclick="showForm();">
   Start A New Post
</a>
<form action="#" id="showme" method="post">

my CSS

#showme {
    font-size: 0.5em;
    color: #000;
    font-weight: normal;
    margin-top: 20px;
    display: none;
}

took out the # sign and still doesn't work

FatalError · Accepted Answer · 2012-02-02 03:49:46Z

3

# is not part of the id:

document.getElementById('showme')

Additionally, that should probably be onclick you're using. Plus, try setting the href to something like href="javascript:void(0);" (other expressions that return a falsy value should work too afaik).

edited Feb 2, 2012 at 3:49

answered Feb 2, 2012 at 3:43

FatalError

55k16 gold badges106 silver badges119 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

noWayhome Over a year ago

been using some jquery so been putting in the #. took that out but still no dice

Sam Dolan · Accepted Answer · 2012-02-02 03:44:30Z

2

Don't use a # sign in getElementById

document.getElementById('showme').style.display = "block";

You want the id, not the selector. See here.

answered Feb 2, 2012 at 3:44

Sam Dolan

32.6k10 gold badges93 silver badges84 bronze badges

Comments

gideon · Accepted Answer · 2012-02-02 04:02:34Z

1

document.getElementById() doesn't need the # .That's a jquery standard kept in line with how you define css ids

See MDN: https://developer.mozilla.org/en/DOM/document.getElementById

edited Feb 2, 2012 at 4:02

answered Feb 2, 2012 at 3:46

gideon

19.5k11 gold badges74 silver badges114 bronze badges

Comments

Umesh Patil · Accepted Answer · 2012-02-02 04:36:14Z

0

Your code is working in below test HTML file:

<html>
<head>
<style type="text/css">
#showme {
    font-size: 0.5em;
    color: #000;
    font-weight: normal;
    margin-top: 20px;
    display: none;
}
</style>
<script type="text/javascript">
function showForm() {      
       document.getElementById('showme').style.display='block';    
    }
</script>
</head>
<body>
<a class="non_link" href="#" alt="start a new post" onclick="showForm()">
   Start A New Post
</a>
<form  id="showme" method="">
Content of the Form<br/>
Content of the Form
</form>
</body>
</html>

answered Feb 2, 2012 at 4:36

Umesh Patil

10.7k16 gold badges56 silver badges81 bronze badges

Collectives™ on Stack Overflow

Why doesn't this Javascript function work?

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related