Jquery issue,function not defined

Question

I've wrote this code seems correct but appear this error :

Uncaught ReferenceError: show is not defined

This is my simple code:

(function ($) {
    $(document).ready
    (
        function () {
            $('.mapban').parent().jclip(0, 0, 1060, 750);

            $('#mapplane').draggable();

            $('#mapplane > div ').css( 'display', 'none' );

            $('.button').attr('onclick','show(this)');

            function show(button){
            alert(button);

            }

        }





    )
})(jQuery)

Why in heaven's name are you trying to set the onclick attribute with jQuery?! You have easy access to the right way to do this (attaching non-exclusive event handlers). — T.J. Crowder
– T.J. Crowder, Commented Nov 7, 2013 at 21:48

adeneo · Accepted Answer · 2013-11-07 21:47:03Z

3

It's not working because the show() function is not in the window scope, it's inside the scope of the document.ready function and the uneccessary IIFE, while the element's onclick handler is trying to call it from the window(global) scope.

Better just use jQuery

jQuery(function($) {
    $('.mapban').parent().jclip(0, 0, 1060, 750);
    $('#mapplane').draggable();
    $('#mapplane > div ').hide();

    $('.button').on('click', show);

    function show(){
        var button = this;
         alert(button);
    }
});

answered Nov 7, 2013 at 21:47

adeneo

319k29 gold badges410 silver badges392 bronze badges

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

7 Comments

Stefano Maglione Over a year ago

I've used attr because in function show i nedd to associate to the button pressed another function no_show.I'm trying to make a switch.Do you know how can i do?

adeneo Over a year ago

You can pretty much get any element or function within an external event handler if you do it right. How exactly to do whatever it is you want to do is impossible to answer without knowing what it is you're trying to do ?

Stefano Maglione Over a year ago

I have a button and this button on first click must show an element and on second click must hide the element and as soon as

Stefano Maglione Over a year ago

I'm sorry but before i try toogle i have a problem with your code...the function show is called instantly when the page is loaded and nothing happen if i click on .button

adeneo Over a year ago

And did you by any chance do $('.button').on('click', show()); and not $('.button').on('click', show); ?

|

lonesomeday · Accepted Answer · 2013-11-07 21:47:23Z

2

Element attributes like onclick are executed in the global scope. The show function does not exist in the global scope. You need to attach a reference to the function's onclick property, not not a string to its attribute. In jQuery you can do this with the on method (among others):

$('.button').on('click', show);

function show(){
    alert(this);
}

answered Nov 7, 2013 at 21:47

lonesomeday

239k54 gold badges330 silver badges329 bronze badges

Comments

Feussy · Accepted Answer · 2013-11-07 21:46:24Z

1

You must declare declare the function show outside of the call to $(document).ready(...);

The way you have it declared now, the scope of the function is limited the execution time of that function and cannot be seen by the page.

answered Nov 7, 2013 at 21:46

Feussy

3841 silver badge4 bronze badges

Collectives™ on Stack Overflow

Jquery issue,function not defined

3 Answers 3

7 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

7 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related