Foxpro
Foxpro

Reputation: 63

jQuery .click(function(){ not working

<a class="click_' + module_row + '_' + element + '_on">Show</a>
<div class="div_' + module_row + '_' + element + '_show">div content</div>

$('.div_' + module_row + '_' + element + '_show').hide();   
$('.click_' + module_row + '_' + element + '_on').click(function(){ 
  $('.div_' + module_row + '_' + element + '_show')
    .fadeIn('slow')
    .show('slow') 
});

I trying to show dynamically a div content via JavaScript. But not working.

Upvotes: 2

Views: 211

Answers (1)

Arcagully
Arcagully

Reputation: 364

I'm guessing that you are adding it dynamically via JavaScript, if that is the case you should use:

$(document).on('click','.click_' + module_row + '_' + element + '_on',function () {        
    // hide here, that is simple
});

Edit 1) DO you have module_row and element defined? I'm thinking that is the problem. Tell us more about those selectors?

Edit 2) Since you told me that module_row and elements are numbers, you should use different syntax. Use php to put module_row and element in attribute. Code HTML:

<a class="div_show" data-module="module_row" data-element="element">div content</div>

Code JS:

$(document).on('click','.click_on',function (e) {        
    // not to reload the page        
    e.preventDefault(e);
    var module = $(this).attr('data-module');
    var element = $(this).attr('data-element');
    $('div_' + module + '_' + element + '_show').hide()
});

You might need to tweak it around little more, but thats it

Upvotes: 1

Related Questions