开发者

Javascript - SyntaxError: Unexpected token }

When I try to make <div id="test">this should go down</div> go down with:

<div onclick开发者_如何学Python="(".test").slideDown(800);">close it</div>

I get this error everytime i click 'close it'

 SyntaxError: Unexpected token }

Please let me know, what I'm doing wrong. Thanks :)


Try like this:

<div onclick="$('.test').slideDown(800);">close it</div>

or even better as it seems that you are using jquery:

<div id="close">close it</div>

and in a separate javascript file:

$('#close').click(function() {
    $('.test').slideDown(800);
});

See how cleaner this is? You no longer need to mix markup with javascript and have problems as the one you are encountering currently.


Change on of the uses of double quotes (and I'm guessing you're using jQuery so you'll also need to add the $ shortcut (or full jQuery call):

onclick="$('.test').slideDown(800);"

// or

onclick='$(".test").slideDown(800);'


You are using an ID selector for the <div id="test"> but trying to use a class selector to animate the <div> with $(.test) which will never match. However your code is also has bad quotes which is causing the SyntaxError, so to fix everything one of the following should help :-)

HTML:

<div id="closeIt">close it</div>

JavaScript:

$('#closeIt').click(function() {
    $('#test').slideDown(800);
});

or Complete example (with separate bound function):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $('#closeIt').click(function() {
                $('#test').slideDown(800);
            });
        });
    </script>
    <style type="text/css">
        #test {
            display:none;
        }
    </style>
</head>
<body>
<div>
<div id="closeIt">close it</div>
<div id="test">this should go down</div>
</div>
</body>
</html>

or inline onclick (not recommended as this doesn't separate markup from behaviour but it still works)

<div onclick="$('#test').slideDown(800);">close it</div>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜