CODEWITHSUNDEEP
javascriptjqueryjquery-events
nsw1475
nsw1475

Reputation: 300

Button onclick to hide text

I have a JavaScript where I need to hide (and eventually show) some text by clicking a button. However, when I click the button, it does not call the function specified in the onclick parameter, and so nothing happens. Here is my source code:

<script type="text/javascript">
        $(document).ready(function(){                   
            var tip = 1;
            $(".tip1").hide();
            $(".tip2").hide();          
            switch (tip) {
                case 1:
                    $(".tip1").show();
                    break;
                case 2:
                    $(".tip2").show();
                    break;
            }           
            function nextTip() {
                $(".tip1").hide();
                
                return;
            }
        });
    </script>
    <br/>
    <div id='bg_container' style='background-image: url("<?=$PICS?>trackingpage_middle.jpg")' >
    <img style='z-index:-1;' width='737px' src='<?=$PICS?>trackingpage_top.jpg'>
    <div id='main_container' >
        <form>
            <input type="button" onClick="nextTip()" value = "Next Tip" />
        </form>
        <div class="tip1">

... and so on.

Upvotes: 1

Views: 2284

Answers (3)

microspino
microspino

Reputation: 7781

Since It seems you are using jQuery why don't you add:

$('input[type="button"]').click(function(){ $(".tip1").hide();});

to your $(document).ready( ... ) code ?

Upvotes: 0

Wadih M.
Wadih M.

Reputation: 13462

Take the nextTip() out of the $(document).ready(function(){} portion.

Upvotes: 0

kennytm
kennytm

Reputation: 523474

Have you tried moving the function nextTip() out of $(document).ready to the global scope?

Upvotes: 1

Related Questions