0

Alright, so I've built a function that looks like this...

function aboutContent(){
  var about = $(this).data('about'),
      img = $(this).data('image');
  $('#background').css('background-image','url('+img+')');
  $('#about-content article').html(about);
  $('#first-name').html('');
  $('#last-name').html('');
}

And I want to call it with a click function, which would look like so...

$('.about').click('click', function() {});

How would I go about calling the aboutContent() function on click?

Thanks!

jwinton
  • 91
  • 1
  • 1
  • 16

9 Answers9

1

Can you try this,

function aboutContent(dis){
  var about = $(dis).data('about'),
     img = $(dis).data('image');
  $('#background').css('background-image','url('+img+')');
  $('#about-content article').html(about);
  $('#first-name').html('');
  $('#last-name').html('');
}
$('.about').click(function() {
    aboutContent(this);
 });
Krish R
  • 22,188
  • 7
  • 49
  • 57
0

pass the function reference as the callback instead of a anonymous function

$('.about').click('click',aboutContent);
Arun P Johny
  • 376,738
  • 64
  • 519
  • 520
0
function aboutContent(element){
  var about = $(element).data('about'),
      img = $(element).data('image');
  $('#background').css('background-image','url('+img+')');
  $('#about-content article').html(about);
  $('#first-name').html('');
  $('#last-name').html('');
}


$('.about').click(function() { aboutContent(this);  });
// alternate ways
// $('.about').click(aboutContent(this));
// $('.about').on('click', aboutContent(this)); // Using on event types
Sender
  • 6,424
  • 12
  • 48
  • 63
0

There are different ways to call a custom function

one of them

$('.about').click(function() {
    aboutContent($(this));
});

function aboutContent(_this){

  var about = _this.data('about'),
  img = _this.data('image');
  $('#background').css('background-image','url('+img+')');
  $('#about-content article').html(about);
  $('#first-name').html('');
  $('#last-name').html('');
}
zzlalani
  • 21,360
  • 16
  • 42
  • 72
0

Simplest way would be:

$('.about').click(aboutContent);

NRaf
  • 7,159
  • 11
  • 49
  • 88
0

That's preety simple.

In simple JavaScript you write the code inside function(){....}. In the same way you can implement same in JQuery. Only syntax has been changed. See below code

$('.about').click('click', function() {
aboutContent();
});
SpiderCode
  • 9,912
  • 1
  • 21
  • 42
0

You can use callback function like this:

$('.about').click(aboutContent);

Note: $('.about').click('click',aboutContent); is wrong way to do.

But you do use on method like this:

$('.about').on('click', aboutContent);
Bhojendra Rauniyar
  • 78,842
  • 31
  • 152
  • 211
0

Use your code like this,

function aboutContent(){
  var about = $(this).data('about'),
      img = $(this).data('image');
  $('#background').css('background-image','url('+img+')');
  $('#about-content article').html(about);
  $('#first-name').html('');
  $('#last-name').html('');
}

$('.about').click(aboutContent(this));
})

your more information related to this refer this link,

Run jQuery function onclick

Community
  • 1
  • 1
Shivam
  • 712
  • 2
  • 10
  • 25
0

try this

$('.about').on('click', aboutContent());

read about on method here

user2727841
  • 665
  • 6
  • 21