Correct jQuery markup

Question

How would I write the following code to jQuery?

       $("select").change(function(){
    if($("#selectedid").is(":selected")){
        $("#showblock").slideDown("slow");
    } else { $("#showblock").slideUp("slow"); } 
});

I also tried the following:

jQuery("select").change(function($){
        if($("#selectedid").is(":selected")){
            $("#showblock").slideDown("slow");
        } else { $("#showblock").slideUp("slow"); } 
    });

It's for wordpress. Thanks!

What do you mean by "write the following code to jQuery?" Please try to be more specific — Mattsjo, Aug 15 '13 at 08:34
Depending on the situation, a simple toggle("slow") could be enough — Mattsjo, Aug 15 '13 at 08:37
Sorry I edit the code a bit. However the problem is that wordpress will give this code an error. As `Property '$' of object [object Object] is not a function ` — Trekdrop, Aug 15 '13 at 08:38
what is the error you're getting? inspect element in chrome and paste the error here please — pythonian29033, Aug 15 '13 at 08:44
can you share a link to the website with us so we can check? — pythonian29033, Aug 15 '13 at 08:46
Possible duplicate of [jQuery Uncaught TypeError: Property '$' of object \[object Window\] is not a function](http://stackoverflow.com/questions/10807200/jquery-uncaught-typeerror-property-of-object-object-window-is-not-a-funct) — Trekdrop, Mar 03 '16 at 21:33

score 2 · Accepted Answer · answered Aug 15 '13 at 08:43

In wordpress you'll probably get errors because wordpress includes a version of jquery that is editted to not use the '$' operator

you have to replace every instance of the '$' with jQuery so your code should look like this;

jQuery("select").change(function(){
    if(jQuery("#selectedid").is(":selected")){
        jQuery("#showblock").slideDown("slow");
    } else { 
        jQuery("#showblock").slideUp("slow"); 
    } 
});

try that and tell me how it works for you.

an easier way would be just to include a standard (downloaded) version of jquery and include it in your header.php

Thanks! that did the trick.. I thought I could give the function a $ variable — Trekdrop, Aug 15 '13 at 08:47

score 1 · Answer 2 · answered Aug 15 '13 at 08:46

I think it happening because You have to resolve the conflict for "$"

From Word Press Codex

jQuery(document).ready(function($) {
    // Inside of this function, $() will work as an alias for jQuery()
    // and other libraries also using $ will not be accessible under this shortcut
});

score 0 · Answer 3 · answered Mar 18 '18 at 10:41

You need to just wrap your code into immediately invoking function and pass Jquery to it.

(function($) {

    $("select").change(function(){
       if($("#selectedid").is(":selected")){
           $("#showblock").slideDown("slow");
       } else { 
           $("#showblock").slideUp("slow");
       } 
  });

})(jQuery);

Correct jQuery markup

3 Answers3