3
$(document).ready(function() {
    $('#talents li').on('click',  'div', function(event) {
        event.stopPropagation();

        $(event.target).addClass('--active');
        talents_points = $('.--active').length;
        _this.setState({ points: talents_points });
        this.handlePointsMaxed(talents_points);
    });
    $('.no-right-click').bind('contextmenu', function(event) {
        event.stopPropagation();

        $(event.target).removeClass('--active');
        talents_points = $('.--active').length;
        _this.setState({ points: talents_points });
        // this.handlePointsMaxed(talents_points);

        return false;
    });
});

<ul id="talents">
    <li onClick={this.handlePointsClicks}>
        <div id="talent-stacks" className="talent-image__stacks"></div>
    </li>
</ul>`

Any idea why? I'm positive it's on the mousedown and click functions but I need them both for what I making and have not found another way to combine these.

EDIT: Added the HTML sample for context

Strychnine
  • 31
  • 2
  • does it still happen when you comment out the `stopPropagation`? – treyBake Jun 09 '17 at 14:27
  • It does still unfortunately. – Strychnine Jun 09 '17 at 14:29
  • where is your html? – hasan Jun 09 '17 at 14:30
  • @Strychnine hm ok, weirdly and coincidentally I have a similar issue with .on('mouseeneter') where it would trigger on the second hover.. haven't found a fix - but will let you know if I do to see if it helps :) – treyBake Jun 09 '17 at 14:33
  • Are there more events on the element? Check all events with https://developers.google.com/web/tools/chrome-devtools/console/events#view_event_listeners_registered_on_dom_elements (if you use chrome) – A. Blub Jun 09 '17 at 14:39
  • @A.Blub I only seem to find the click event listener. Normally I would think something is listening before this that takes up the first click but I don't have anything else in my code but this. – Strychnine Jun 09 '17 at 15:08
  • yeah, maybe bind the click event in code or by attribute, but not both. remove the onClick={...} from that li. you're already handling the click event in your jQuery. this is why it's very important to show *all* relevant code including markup. – mjw Jun 09 '17 at 15:35
  • But did you checked it in your browser? There are maybe plugins with event handler and you can check it there – A. Blub Jun 09 '17 at 15:42

1 Answers1

0

I was able to fix this, I didn't have the function set correctly in the componentDidMount lifecycle of the react component.

Thanks everyone for your input.

Strychnine
  • 31
  • 2