How to add a B event to an object bound with event A is determined by event B to determine whether event A is triggered. It is very easy to bind events through jQuery.
The Code is as follows:
$ ("A"). click (function () {<BR> console.info ("A"); <BR> return false; <BR >}); <BR>
However, after binding event A, I found that I needed event B to decide whether to trigger the event. It is easy to do, and now I will change it.
The Code is as follows:
$ (""). Click (function () {<BR> console.info ("B"); <BR> return false; <BR >}); <BR >$ (""). click (function () {<BR> console.info ("A"); <BR> return false; <BR >}); <BR>
Can the click event be blocked? This is counterproductive.
If event B needs to be asynchronously called to determine whether event A needs to be triggered?
The Code is as follows:
$ (""). Click (function () {<BR> $. ajax ({<BR> url: "B .html", <BR> success: function (msg) {<BR> if (msg) {<BR> lele.info ("pass "); <BR> return true; <BR >}else {<BR> console.info ("nopass"); <BR> return false; <BR >}< BR >}); <BR >$ (""). click (function () {<BR> console.info ("B"); <BR> return false; <BR >}); <BR>
Fact discovery is impossible. What should we do?
Let's talk about several ideas:
Bind A later event to another trigger. For example, if event A is bound to the click event, event B is bound to the mouseover event, which triggers the mouseover event first and then blocks the click event. (After research, it was found that this was almost impossible)
Process two events through the queue of jquery. (This can solve the issue of triggering events successively, but the reality is that all events in the project have been bound. Currently, you need to add a judgment AJAX request before each button event. Or rewrite all button events, or find another path)
Go deep into jQuery's event mechanism, get its event queue, and process its event queue.
The Code is as follows:
// Let us bind an event to it by default, which is called A event <BR> $ (""). click (function () {<BR> console.info (1); <BR> return false; <BR> }); <BR> // now we want to trigger the next bound B event first, control whether event A is triggered <BR> // obtain the click event in the event object bound to object a <BR> var event = $ (""). data ("events "). click; <BR> // because a is also used in our B event, to prevent this object from changing, therefore, we specifically declare the variable that to save <BR> var that = $ ("a"); <BR> // The following is the B event, but it seems that it is not bound. <BR> var B = function () {<BR> $. ajax ({<BR> url: "B .html", <BR> success: function (msg) {<BR> If (msg) {<BR> console.info ("pass"); <BR> tt. call (that); <BR >}else {<BR> console.info ("nopass"); <BR >}< BR> }); <BR> return false; <BR >}; <BR> // key object, please pay attention to it as much as possible <BR> var tt; <BR> // key code, pay more attention to <BR> for (var I in event) {<BR> tt = event [I]; <BR> event [I] = B; // if this line is commented out, the following two lines must be uncommented. The effect is the same, and the principle is different... <BR> // delete (event [I]); <BR> // that. click (B); <BR> break; <BR >}< BR>
The problem seems to be solved successfully, but can the return in the AJAX callback function be captured?