JQUERY, CSS, event handlers

Question

I am supposed to use Jquery to call a function that changes a div's visibility using css. This is my JQUERY

    alert("Interactive on line");
    function changeView(page)
        {
              alert("Handler for click() called. ");
              if(page === 'home)
                 {
                    $('#HomeTab'.css(display=='none'));
                 }
        }
    $('#HomeTab').on('click', { page:'home'}, changeView());

I used the alert statement inside the changeView to see if changeView ever gets called and it does not. The initial alert before the changeView function does get called, so the script is linked correctly. Thank you in advance!

I copied Rayon's snippet word for word and pasted it in my folder. It still does not work :/. The outer alert is being called, but it does not even get to the inner alert. — Nithin, Jun 23 '16 at 04:11

score 4 · Accepted Answer · edited Jun 23 '16 at 12:53

4

Refer .on( events [, selector ] [, data ], handler )

(a) You are invoking/calling function, not assigning it as handler, Remove () after function name.

(b) data object could be accessed using event.data.KEY

(c) Also correct the typo while using .css method, it is jQueryElement.css(PROPERTY,VALUE)

function changeView(e) {
  alert("Handler for click() called. ");
  if (e.data.page === 'home') {
    $('#HomeTab').css('display', 'none');
    //OR $('#HomeTab').hide();
  }
}
$('#HomeTab').on('click', {
  page: 'home'
}, changeView);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id='HomeTab'>Home Tab</div>

edited Jun 23 '16 at 12:53

cssyphus

37,875
18
96
111

answered Jun 23 '16 at 03:31

Rayon

36,219
4
49
76

i suggest to just add a class with the desired style rather than directly adding css using jquery :) – guradio Jun 23 '16 at 03:38
2

@guradio, It depends on developers preference.. OP has few _syntax_, in his code..Suggesting something else would not make it good answer. I do not find any harm in using `.css` method but again, _It is developers preference_ I would have opted for _class approach_ if I had to change many styles than just one..But yes, OP could go with `jQelem.hide()` – Rayon Jun 23 '16 at 03:41

JQUERY, CSS, event handlers

1 Answers1