CODEWITHSUNDEEP
javascript
noWayhome
noWayhome

Reputation: 668

Why doesn't this Javascript function work?

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

Upvotes: -1

Views: 3943

Answers (4)

Umesh Patil
Umesh Patil

Reputation: 10705

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>

Upvotes: 0

gideon
gideon

Reputation: 19465

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

Upvotes: 1

FatalError
FatalError

Reputation: 54621

# 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).

Upvotes: 3

Sam Dolan
Sam Dolan

Reputation: 32542

Don't use a # sign in getElementById

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

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

Upvotes: 2

Related Questions