4

I'm developing a browser extension that lets users mark answers as favorites. The default Stack Exchange behavior when the favorite button is clicked messes everything up, though. Even if I set my own event listener to replace the default behavior, it seems to automatically undo my code and do the default behavior.

enter image description here

How can I "turn off" default Stack Exchange behaviors?

Improve this question
1
  • 1
    This needs an MCVE. Depending on the circumstances it may also belong on SO or MetaSE.
    – Brock Adams
    Commented Jan 3, 2017 at 22:03

2 Answers 2

Reset to default
2

First can I say, you might want to use your own icon. Font Awesome is a very useful and easy to use icon toolkit that lets you add icons with simple CSS classes. You could use http://fontawesome.io/icon/star/ if you want :)

However, if you want to use SE's button, in Javascript, if you want to override an event handler, you need to return false; or call event.stopPropogation() (jQuery) at the begininng of the event handler function.

So, if you are using jQuery, to disable SE's handler:

$('.star-off, .star-on').click(function(event) {
    event.stopPropogation();
    //your custom handler code here
});

This makes sure the event doesn't reach the DOM so it doesn't do the original action. You'll find lots of questions on Stack Overflow relating to this if you want to find out more.

Improve this answer
1

Don't use the default button. That's bad UI anyway. Add your own favorite button for each answer.

And, since you will be using your own classes, like:

<a class="myStarOff" href="#" data-ansID="1234" title="Click to add as favorite answer (click again to undo)">
favorite</a>

<a class="myStarOn" href="#" data-ansID="56789" title="Click to remove from favorite answers (click again to redo)">
favorite</a>

...and your own event handlers; there will be no conflict.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .