JQuery :: Overcoming Limitations Of Live Events And StopPropagation
Jan 17, 2010
I am trying to accomplish something like this:
<p>
text <a>link</a>
</p>
----
$("p").live("click", ... something cool...);
$("p a").live("click", function(e){e.stopPropagation();});
//so the link is still followed but the click event on the P is not triggered.
This fails since live events bubble differently than bound events. So, what I have to do instead is $("p a").live("click", function(e){return false;}); but then the link is not followed. So, I do $("p a").live("click", function(e) location.href=this.href; return false;}); but then "open in new window" doesn't function correctly. Is there a good way to overcome this limitation/behavior?
View 2 Replies
ADVERTISEMENT
Jul 6, 2009
As far as I understood, stopPropagation() is supposed to stop events bubbling 'up' though the element tree (through parent elements). Eg. If I use stopPropagation() on a click event on an anchor element in a list, the event would not be triggered on the list. In my code I have a popup div, that needs to have stopPropagation(), as a click on the document (everywhere other than the popup) will hide it. When I add an element to the popup that has a live click event, the live click event is never called, even though it is a child element of the popup. Shouldn't the live click get called first? If I remove the stopPropagation all is well.. some code:
$('#a_test_link').live("click", function(e){
e.preventDefault();
alert('done!');
});
[Code].....
View 1 Replies
View Related
May 18, 2009
I normally do this with livequery:
So any new .mylink's on a page would also be bound with my custom function.
How can I do this with the new LIVE event? or is it even possible?
View 4 Replies
View Related
Jan 21, 2011
I am finding that remove() does not remove live events. I'm wondering why this is. I've also noticed that the selector for .die() has to be specificand I can not simply do $("*").die().Is there a reason for this? I found that if I use delegate instead of live then it does get detached. I'd like to understand this since it's causing double/triple event triggering in my pages.
View 2 Replies
View Related
Mar 1, 2010
Following code works.
$('#container a').bind('click', function(e){
log( $(this).text() + ' clicked1');
return false;
});
[Code].....
View 2 Replies
View Related
Mar 24, 2011
I've come across an issue where I've got a dynamically created popup class that despite appearing to be bound according to Visual Event does not fire on clicking the closebutton attached to it. I'm not getting any errors in firebug and by setting breakpoints I've verified we are not reaching the code to execute. Ruling out the usual suspects such as obvious spelling mistakes/ swapping out jquery versions 1.3/1.4/1.5 doesn't make any difference.where else I can look?Here is the original function:
$this.find(".close").live('click', function() {
var $this = $(this);
$this.parents("." + sets.popupClass).remove();
[code]....
View 2 Replies
View Related
Apr 11, 2009
I am looking for a way to simulate the actions of the hover (or mouseenter/mouseleave) whilst using the live method of binding (The items are dynamic). Is there a way to do this or will I need to use the 'old fashioned' method of unbinding and rebinding? I do not want to use a plugin.
View 6 Replies
View Related
Jun 10, 2009
I use the live - method to bind a handler to a click-event for all links with class "userDiv"
When I DON'T use this and use instead the "normal" click handler
I can still use the middle Mouse-Button in Firefox to open the link in a new tab without any jquery-stuff
But when I use the live-method (and it would be nice to use it) the middle Mouse-Button behaves like the left one.
View 2 Replies
View Related
Jan 18, 2007
I'm hoping that someone here can help us out. We are in
the process of re-writing the underlying code for my
website (link to old version below). The site is (and
will continue to be) driven by PHP, javascript, and MySQL.
The problem I'd like to overcome is the browser's
navigation backwards through the tiers of screens and
menus. We have a "Back" link on the required pages, but
I would like to let the user navigate via the browser's
built in "Back" function, without getting the following
warning (from Netscape, in this case):
~~~~~~~~~~~~~~~~~~~~~~~~~~~
The page you are trying to view contains POSTDATA that
has expired from the cache. If you resend the data, any
action the form carried out (such as a search or online
purchase) will be repeated. To resend the data, click
OK. Otherwise, click Cancel.
~~~~~~~~~~~~~~~~~~~~~~~~~~~
There is no secure data, nor purchases involved. I
believe this is built into the browser, but I'm hoping
there is a way to bypass the warning without breaking
the function (creating an error) on the site. I believe
this is a javascript issue, but if I'm wrong, please
let me know and I will post to a PHP group.
View 3 Replies
View Related
May 3, 2006
Can I limit the number of times an "alert" is activated.
I have a button which a user is likely to click more than once. The user needs to be aware of some facts, so I have an "alert" set up.
But I don't want them to have to view the "alert" every time they click the button.
Is it possible to have the "alert" appear only once.
View 4 Replies
View Related
Jul 20, 2005
I just wrote the following script for something I'm working on:
<html>
<head>
<script type="text/javascript">
function KP_growit(subject,widthto,heightto) {
var target = document.getElementById(subject);
var tweenit = setInterval(grower,10);
function grower() {
(parseInt(target.style.width) < widthto)? target.style.width =
(parseInt(target.style.width) + 10) + "px";
(parseInt(target.style.height) < heightto)? target.style.height =
(parseInt(target.style.height) + 10) + "px";
(parseInt(target.style.width) == widthto && parseInt(target.style.height)
== heightto)? clearInterval(tweenit);
}
}
</script>
</head>
<body>
<div id="bluebox" style="position:absolute; left:173px; top:48px;
width:100px; height:80px; z-index:1; background-color:#99CCFF;"></div>
<div><a href="#" onClick="KP_growit('bluebox',400,300); return false;">grow
it</a></div>
</body>
</html>
I noticed that the script does not work because of the conditional
operators; however it DOES work when using the if...else format. Why is
this?
View 4 Replies
View Related
Jan 11, 2011
I'm doing a tree-like structure using divs inside divs. I use event.stopPropagation() to stop parent events from firing when clicking inside them. This works just fine in Chrome and Firefox, but in IE8, I get an error message ("Object doesn't support this property or method") and the events propagate to the parents.
[Code]...
This works fine in Firefox and Chrome, but IE8 throws an error on event.stopPropagation(); saying "Object doesn't support this property or method". I have tried passing event as an argument to the function that handles the stopping of propagation but that doesn't help either. What's wrong and how do I fix it?
View 1 Replies
View Related
Dec 13, 2010
I am working on creating a JQuery program that will take an unordered list and dynamically expand it using ajax calls. This is my code:
$(document).ready(function() {
$('.child').click(function(event) {
event.stopPropagation(); var uid = $(this).attr('id').substring(10);
[code]....
View 1 Replies
View Related
Dec 11, 2003
I have a DIV that contains some links. I have an onmouseout event handler on the DIV, and I want it triggered only when the mouse leaves the DIV. Since there are Anchors in the DIV, onmouseout events will be generated when the mouse moves from one link to another, and those events will bubble up to the DIV. According to all the documentation that I have read, I should be able to prevent that from happening by having an onmouseout event handler for each of the anchors, and calling event.stopPropagation in the event handler. But it is not working in Mozilla and Opera, the onmouseout still bubbles up from the anchor to the DIV. I have it working in IE, but that is because IE does not support stopPropagation(), and instead uses window.event.cancelBubble=true, which Mozilla and Opera do not support. Code:
View 3 Replies
View Related
Oct 8, 2006
On this page I'm given the impression that stopPropagation is a lot
like returning false:
http://www.brainjar.com/dhtml/events/default3.asp
"preventDefault() Can be used to cancel the event, if it is
cancelable. This prevents the browser from performing any default
action for the event, such as loading a URL when a hypertext link is
clicked. Note that the event will continue propagating along the normal
event flow.preventDefault() Can be used to cancel the event, if it
is cancelable. This prevents the browser from performing any default
action for the event, such as loading a URL when a hypertext link is
clicked. Note that the event will continue propagating along the normal
event flow."
But often, if I want to stop a hyperlink from working normally, I can
simply return false from whatever action I've attached to that
hyperlink. Suppose I have this link:
<a id="link1" href="index.htm">link text</a>
Suppose I attach the function "alertDanger" to this link:
function alertDanger() {
alert("Danger!");
return false;
}
Because I return false, the default behavior doesn't occur. Would there
ever be a benefit to doing this instead:
function alertDanger() {
alert("Danger!");
preventDefault();
}
Perhaps preventDefault is only for those occassions when the code can
not or should not return?
View 3 Replies
View Related
Jul 21, 2010
I am trying to "ajaxify" my site. Now I have one problem:
$("#posts").children().remove();
$("#tag-sidebar").children().remove();
$.each(data.Tags_Sidebar, function (indexInArray, valueOfElement) {
var insert = $("<li>");
[Code]......
Now when I click one of those links (href1, href2, href3) generated, the click event won't execute! What's the problem? Also, is it right that I have to transfer the valueOfElement over, like I did? What does stopEventPropagation do? Prevent the href from being navigated to? That's what I am trying to do.
The data object is JSON fed from here:[URL]
The HTML is here: [URL]
View 2 Replies
View Related
Feb 4, 2011
I have a series of images with an animation bound to mouseover and mouseleave events, and I'm trying to get my head around adding a click event that would prevent the mouseleave animation from occurring only for the image that was clicked, preserving everything else as is (until another image is clicked). I've discovered .stop() and I think I'm getting close, but some part of the logic is still escaping me.
View 3 Replies
View Related
Sep 24, 2009
I've got 2 pages: a current events page and a past events page the current events page loads fine as there is only about 10 events the past events page takes about 30 seconds to load and will crash if u click your mouse in the loading time.
The pages are near identical the only difference is the query that selects the events (> versus <)
The page loads immediately without:
But when i put it back in the above happens. I'm using jQuery.roundedcorners.
View 1 Replies
View Related
Jul 22, 2010
I have a function that I apply to every anchor tag in a div called listnav. I do so like this:
$('.listnav a').each(function(i, el) {
$(el).click(function(ev) {
ev.preventDefault();
var href = $(this).attr('href');
[Code]....
This,among other things, causes a function called load to be called on the href of the anchor. This works fine. Howver I want to use the live() function with this as I am going to dynamically change the links in the listnav div. I tried doing it like this :
$('.listnav a').each(function(i, el) {
$(el).live('click',function(ev) {
ev.preventDefault();
[Code]....
But that does not work. My question is how would I go about changing this function so that the actions are applied to any new anchors added to the div dynamically?
View 2 Replies
View Related
Jan 10, 2012
I am exhausted today, not to include the funk that the BCS national championship put me in, so I must be either crazy or missing something. When I do the following the code works;
[Code]...
View 3 Replies
View Related
Oct 4, 2010
how to toggle between functions, however I because I am reloading the element that contains the checkbox I am clicking, I need to use the live function (I think).
I have used live before and it works great for clicks, but can I use it with toggle.
View 1 Replies
View Related
Oct 14, 2010
frist of all, im a newbe on jquery. i have a table where i can add new "<span>" and i can edit it with editInPlace plugin but i have a problem. when i load the web with those elements (<span>), i cant edit it after i add a new item, then, all the items are editable
[Code]...
View 1 Replies
View Related
Aug 8, 2011
how I can execute this 'function(dateStr, inst)' . The jQuery partially works it divert to another page but without parameters, the outcome displays [object Object].
Code:
$.noConflict();
jQuery(function() {
jQuery('#datepicker').datepicker({
[Code]....
View 1 Replies
View Related
Jan 31, 2011
I am using a delayedObserver which works great, but I can't figure out how to use it when the field I am binding is loaded via ajax. So ideally, something like this:
$('[data-live_form_field]').live
.delayedObserver(0.35, function(value, element){
$(this).parents('form:first').submit();
});
This would bind any form elements with the live_form_field data attribute to the observer and submit the form. The code doesn't work though since that isn't the right syntax for the .live method.
View 1 Replies
View Related
Jun 18, 2009
So I have a set of <SELECT> elements that are ajax'd in and out depending on what is selected using the event "change". I know that .live("change") is not fully supported.
View 2 Replies
View Related
Sep 1, 2009
This is my Html: I am trying to get the element that I binded to live(), but always i am getting it's children. For example, this is my code:
<div id=div1 class=theClass><b>Hye</b></div>
<div id=div2 class=theClass>Hello
</div>
[Code].....
View 1 Replies
View Related
