Develop Reference

js stop click function subsequent execution after call back in ajax of itself

On the first click myClick() has been called again in itself of myLoad() then at the second click, this myClick() will execute two times
=> The following causes two subsequent execution of
click event of #myBtn by one click
How to avoid or stop this? Please anybody suggest me new logical method or which way to stop this.
$(function() {
myLoad()
})
function myClick() {
$("#myBtn").click(function() {
myLoad(); //load new every click
});
}
function myLoad() {
$("#myCnt").load('ajax.php', {
"data": "some"
}, function() {
myClick() //to live the click event works after ajax load
})
}

Problem with your implementation is that in each call to myClick() an new event handler is attached to button.
You can use .off() to remove existing event handler attached using .on().
function myClick(){
$("#myBtn").off('click').on('click', function(){
myLoad();//load new every click
});
}
A better approach would be to use .on() method with Event Delegation approach, when generating elements dynamically.
General Syntax
$(document).on('event','selector',callback_function)
In place of document you should use closest static container.
The delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time. By picking an element that is guaranteed to be present at the time the delegated event handler is attached, we can use delegated events to bind the click event to dynamically created elements and also to avoid the need to frequently attach and remove event handlers.
A good read Direct and delegated events
Modify you code as
$(function() {
myLoad();
$(document).on("click", "#myBtn", function() {
myLoad(); //load new every click
});
})
function myLoad() {
$("#myCnt").load('ajax.php', { "data": "some"}, function() {
//No need to call my click
})
}

Issues is in the flow of your code
First time when you call myClick() it binds the click event with #myBtn,
On second time it binds that event again , so it will be called twice , remove that event binding from there,
Or else $("#myBtn").click will be bind each time you call the myClick function.
As solution please try this code :
$(function(){
myLoad()
})
$("body").on( "click" , "#myBtn" , function(){
myLoad();//load new every click
});
function myLoad(){
$("#myCnt").load('ajax.php', {"data":"some"}, function(){
$("#myBtn").trigger("click");
})
}

Programmatically call "mousemove" event in JS

Is there a possibility to programmatically call the mousemove event in jQuery?
Obviously, I'm not going to change the actual position of the cursor - it's impossible. All I want is re-call this event so all other scripts that have attached their handers to it will also be called.

To trigger event handlers bound to the mousemove event you can use trigger()
$('#elementID').on('mousemove', function() {
// do stuff
});
$('#elementID').trigger('mousemove'); // triggers above event handler

jQuery trigger events stack over time

I have a generall question about define customer events and trigger then:
jQuery(document).on('btn.hover', function () {
jQuery('.orange_bubble').hover(function () {
jQuery(this).addClass('hover');
}, function () {
jQuery(this).removeClass('hover');
});
});
Now i can call the trigger event to fire this event one time.
jQuery(document).trigger('btn.hover');
If i generate content over ajax or via js i need to get rebind the event on new elements:
so i trigger it again:
$.ajax{
bla
success: {
jQuery(document).trigger('btn.hover');
}
}
How can i do this without stacking the events. I have this problem right now.
I am useing some customer events and sometimes they have to reinitate on all elements, but just onetime and not stacking.
What is the bestpractice to firing events once time ?
If they are set to some elements in the dom?
Thx for help

.hover() is a shortcut for using mouseenter and mouseleave events, but one drawback is it cannot be used for registering delegated handlers, so instead of using .hover() use the events directly.
So try
jQuery(document).on({
mouseenter: function () {
jQuery(this).addClass('hover');
},
mouseleave: function () {
jQuery(this).removeClass('hover');
}
}, '.orange_bubble')

First of all you don't have to rebind the event to newly added elements if you use event delegation.
From JQuery page
Delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time. By picking an element that is guaranteed to be present at the time the delegated event handler is attached, you can use delegated events to avoid the need to frequently attach and remove event handlers
you could use something like:
$( "//container of .orange_bubble elements" ).on( "hover", ".orange_bubble", function() {
//your content
});
This will also prevent you from "stacking" the events

Jquery event handling order: click on ele: itself or parent first?

I have the following click event handlers:
$('html').click(function() { do something});
$('#my_div').click(function() { do something});
my_div is a descendant of html.
If I click on my_div, can I control which is called first? Can I depend on the my_div handler always being handled first?

The Child event handler is always called before the parent event handler (event bubbling). So when you click #my_div, its click event handler is called. Here, you have the option to stop the event to bubble up to html click handler by using
event.stopPropagation()
i.e.
$('#my_div').click(function(event) {
event.stopPropagation();
});
Note: when using jQuery, event.stopPropagation() may not work in all browsers. You will have to take event as an argument in your click handler
ie. $('#my_div').click(function(event){ ... });

why does this on() trigger right away instead of just binding?

Im having some problems with .on() and how to use it instead of .bind() in this situation.
What im trying to do here is i click a link and that is supose to bind another click event, but instead it triggers that event right away. I looked in the documentation/jquery.js file and this is how im suppose to do it.
Demo: http://jsfiddle.net/bNaFV/
$('#click_me').on('click', function(){
$('#show_me').addClass('remain');
//this is only suppose to bind that next time i click anywhere on the document it should hide
// not right away
$(document).on('click', 'html', function(){
$('#show_me').hide();
});
});
$("#click_me").hover(
function () {
$('#show_me').show();
},
function () {
if ($('#show_me').hasClass('remain')){
return;
} else {
$('#show_me').hide();
}
}
);
click me<br /><br />
<div id="show_me"></div>​

You need to stop the propagation of the event:
$('#click_me').on('click', function(e){
e.stopPropagation(); //Stop the event from bubbling further
$('#show_me').addClass('remain');
$(document).on('click', 'html', function(){
$('#show_me').hide();
});
});
This is because the event has been captured at the #click_me element. You then bind an event handler for that same event type somewhere higher up the DOM tree. The event then continues bubbling up the tree and reaches the document, where it triggers the new event handler.
Here's a working example.
Update (see comments)
As noted by #zerkms in the comments, I think you probably only want to bind the event handler to document once. You could use the one method to do so, which unbinds the event handler after it's been executed once:
$(document).one('click', 'html', function(){
$('#show_me').hide();
});