Question

55

How to prevent click event in jQuery?

rated 0 times [ 62] [ 7] / answers: 1 / hits: 19252 / 11 Years ago, thu, january 30, 2014, 12:00:00

My html code is as follows:

<h4 class=milestonehead style=cursor: pointer; onclick=editFun('35');>

     Some Header

     <img src=/images/delete.gif style=float: right; onclick=deletefun('35');>

</h4>

There are two functions in <h4> if user click on header i.e <h4> then I need to open a popup with edit form. If user click on delete image/icon then I need to execute a delete function.

Both functions editFun and deletefun execute ajax calls. In my case if the user clicks on delete icon then first it calls editFun function and then it is calling deleteFun. How can I call the appropriate function for the event.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

bobbidayanam

Add To Favorites

Follow

Total Points: 82

Total Questions: 99

Total Answers: 96

Location: Venezuela

Member since Sat, Apr 24, 2021

3 Years ago

bobbidayanam questions

1 How to submit the simple log with AWS CloudWatch Logs from frontend?

Wed, Sep 23, 20, 00:00, 4 Years ago

1 React use debounce with setState

Sat, Mar 21, 20, 00:00, 4 Years ago

1 How to get the length of every word in a string

Mon, Dec 24, 18, 00:00, 6 Years ago

1 Unable to resolve module 'expo-font.js'

Fri, Nov 16, 18, 00:00, 6 Years ago

1 Angular 6 and Angular Material - mat-radio-group [(ngModel)] set dynamic variable inside *ngFor

Thu, Sep 27, 18, 00:00, 6 Years ago

View All

answered 11 Years ago brandt · Accepted Answer

If you're using jQuery, get rid of the inline JS and CSS and move them into their own files:

CSS:

.milestonehead { cursor: pointer; }

.image { float: right; }

HTML

<h4 class=milestonehead data-id=35>

  Some Header

  <img class=image src=/images/delete.gif>

</h4>

JS

$(document).on('click', '.milestonehead', function () {

  var id = $(this).data('id');

  editFun(id);

});

In this case you can just use the data id on the parent node. Data attributes are by far the best way to store data on your HTML elements.

$(document).on('click', '.image', function (e) {

  e.stopPropagation();

  var id = $(this).parent().data('id');

  deleteFun(id);

});