2

I'm trying to prevent the defined onclick events of the children of an element being run by returning false from the mousedown event on the container like so:

submit_container.mousedown(function(event){
    return false;
});

If I write my code like this, it doesn't work. However, if I add an alert first, the click events are in fact stopped:

submit_container.mousedown(function(event){
    alert('Alert');
    return false;
});

The same issue was alluded to here, but sadly none of the answers address this.

EDIT: JSfiddle example. I want the behaviour of the second link, but without having to trigger an alert

Community
  • 1
  • 1
Radical
  • 1,003
  • 1
  • 9
  • 25
  • I'm not sure I'm following entirely. Can you provide a jsfiddle? I think you might be looking for event.stopPropagation(), but again, I can't say for certain. – tpdietz May 20 '16 at 14:21
  • try adding event.preventBubble()? – Dalton May 20 '16 at 14:22
  • @tpdietz Added a JSfiddle to the question – Radical May 20 '16 at 14:31
  • 1
    @Radical, thank you. I definitely understand the problem completely now. I have no good solution to the problem, but can at least provide some insight. The anchor element will be the first to receive the event. By the time the mousedown event fires on container's event handler, the anchor element has already received that event. Trying to prevent the actions of the event handler of the anchor element should probably occur on the anchor element (as opposed to the container). I've come up with a couple solution toying with the jsFiddle, but alas, they are all ugly hacks. – tpdietz May 20 '16 at 14:46
  • I agree preventing the action on the element itself would be much better, but I'm in a situation where the elements are being dynamically loaded and as I understand it there is no way for me to hook into the elements directly when the above code is loaded, so I have to go through the container. – Radical May 20 '16 at 14:51

2 Answers2

2

The mousedown is working for the container class . Your problem is that a href has a click event attached to it not mouse down. So you should be using onclick on the container or the href as event Propagation will occur and bubble up to the parent . You can still stop this from happening .

Example.

submit_container.click(function(event){
    event.stopPropagation();
    event.preventDefault();
    return false;
});

Hope this helps

KpTheConstructor
  • 3,153
  • 1
  • 14
  • 22
  • This does indeed help in my problem described above, so already thank you for that! My actual problem turns out to be a little bit more complex though. My element in the container actually has a custom onclick attribute attached to it, which I want to call at a different point in time (So onclick I basically first want to `preventDefault`, then do something else, and eventually still run the onclick code). See [this jsfiddle](https://jsfiddle.net/70tg2gfu/). As you can see there, clicking the link does indeed not open the new tab, but it does still execute the onclick event. Any ideas on this? – Radical May 20 '16 at 15:43
0

Are you using jQuery? Try with a "preventDefault" method:

submit_container.mousedown(function(event){
    event.preventDefault();
    return false;
});
Andrey Etumyan
  • 1,394
  • 11
  • 17