Why doesn't my javascript onclick work with div?

Question

I am trying to turn a <div> into a link to local HTML document (./lilo/index.html) using JavaScript.

HTML

<div class="pagelist_item" onClick="goto("./lilo")">
    <h4>Test Button</h4>
    <h6>Discription</h6>
</div>

JavaScript

function goto(url){
    window.location = url;
    alert(url);
}

See http://jsfiddle.net/6HHTd/

But when I click the button, nothing happens.

Why does this not work?

Andy G · Accepted Answer · 2013-07-21 19:18:13Z

7

Your quotes are incorrect in this line:

<div class="pagelist_item" onClick="goto("./lilo")">

jsfiddle even shows the error in red text.

Using apostrophes makes it easier to fix:

<div class="pagelist_item" onClick="goto('./lilo')">

To clarify, in "hi "there" you" the second double-quote matches with the first, closing the string and causing an error with the rest of the expression. Escaping the quotes with back-slashes works "hi \"there\" you" but embedding apostrophes (single-quotes) within double-quotes is often easier. (JavaScript is happy to use either single or double-quotes to delimit strings.)

Also rename your function from goto, as it is a reserved keyword.

edited Jul 21, 2013 at 19:18

answered Jul 21, 2013 at 18:36

Andy G

19.4k5 gold badges49 silver badges70 bronze badges

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

4 Comments

Andy G Over a year ago

As the question was "why does my JavaScript not work" then I would suggest that it is an answer.

Ryan McDonough Over a year ago

@harsha yes it is an answer.

Joe Minichino Over a year ago

@DobbyIsDead: to clarify andy's response, you can't use goto as a function name, it is a keyword reserved for future use in javascript which cannot be used as an identifier.

Andy G Over a year ago

Thank you @JoeMinichino. Someone else mentioned that it was a keyword but their comment disappeared. I've edited my answer to clarify.

Nithesh Narayanan · Accepted Answer · 2013-07-21 18:45:54Z

2

Use jquery as follows

$('.pagelist_item').click(function(){
     window.location="./lilo";
});

Fiddle

answered Jul 21, 2013 at 18:45

Nithesh Narayanan

11.8k35 gold badges102 silver badges140 bronze badges

Collectives™ on Stack Overflow

Why doesn't my javascript onclick work with div?

HTML

JavaScript

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

HTML

JavaScript

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related