All geek questions in one place

How do you create an event listener that determines if a boolean variable becomes true?

For example, I have var menu_ready = false; . I have an ajax function that sets menu_ready to true when the ajax action is executed:

 //set up event listener here $(...).load(..., function() { ... menu_ready = true; }

How to set up an event listener expecting menu_ready be true?

+6
source share
7 answers

One way is to constantly poll:

 function checkMenu() { if (!menu_ready) { setTimeout("checkMenu();", 1000); return; } else { // menu_ready is true, so do what you need to do here. } }

and...

 <body onload="checkMenu();">
+1
source

You cannot connect event listeners to JavaScript variables as such, but you can fake them. Instead of the boolean var, use an object with the get , set and listen methods:

 function Bool(initialValue) { var bool = !!initialValue; var listeners = []; var returnVal = function(value) { if (arguments.length) { var oldValue = bool; bool = !!value; listeners.forEach(function (listener, i, list) { listener.call(returnVal, { oldValue: oldValue, newValue: bool }); }); } return bool }; returnVal.addListener = function(fn) { if (typeof fn == "function") { listeners.push(fn); } else { throw "Not a function!"; } }; return returnVal; }

You would use it as follows:

 var menu_ready = Bool(false); if (menu_ready()) { // this code won't get executed, because menu_ready() will currently return false; } menu_ready.addListener(function (e) { if (e.oldValue != e.newValue) { // value changed! } }); menu_ready(true); // listeners are called.
+7
source

There is no cross-browser (cross-platform) event that does this work. There are some fairly specific mechanisms for watching object properties, but nothing needs to be tracked for booleans (imo).

You want to execute the callback function while you set this variable to true. You can also apply some jQuery sugar:

 function myCallbackReference() { alert('yay'); } $('#foobar').load('/some/code', function() { menu_ready = true; }).done( myCallbackReference );
+2
source

You cannot attach event listeners to individual variables.

The best way to do this is to place the variable in the object and force all users of the variable to access it through the “get” and “set” methods or more specifically named methods. When you set a value, you can check if the value is really changing, how you are interested and act accordingly. Here is an example:

 var _isMenuReady = false; // do not access this directly function isMenuReady() { return(_isMenuReady); } function setMenuReady(val) { if (arguments.length < 1) { val = true; } if (!_isMenuReady && (val)) { _isMenuReady = val; // _isMenuReady has gone from false to true // do whatever you need to do now } _isMenuReady = val; } // sample code var ready = isMenuReady(); // returns whether the menu is ready or not setMenuReady(); // sets the menu to be ready now setMenuReady(false); // sets it back to not ready

You can even make it a private member of the object, so no one can get it directly outside the real access methods (although this is not necessary if all the code belongs to you and you collaborate without accessing the variable directly). But if you want to make it truly private, see this article for information on how to create private members. Essentially, you create a solid function closure, which local variables are only available inside the function. This is a cool technique.

 function menuReadyTracker(initialValue) { var value = initialValue; var subscribers = []; this.get = function () { return(value); }; this.set = function(newVal) { if (newVal != value) { value = newVal; var o; for (var i = 0; i < subscribers.length; i++) { o = subscribers[i]; o.func.call(o.ctx, o.data); } } } // call subscribe to register a notification callback this.subscribe = function(f, data, ctx) { var o = {}; o.func = f; o.data = data; o.ctx = ctx || window; subscribers.push(o); } // call unsubscribe to remove a notification callback this.unsubscribe = function(f, data, ctx) { var o; var newSubscribers = []; for (var i = 0; i < subscribers.length; i++) { o = subscribers[i]; if (o.func != f || o.data != data || o.ctx != ctx) { newSubscribers.push(o); // copy if it doesn't match } } subscribers = newSubscribers; } } var menuReady = new menuReadyTracker(false); menuReady.subscribe(myNotification, "in real-time."); console.log(menuReady.get()); menuReady.set(true); console.log(menuReady.get()); // this function gets called whenever the menu flag goes from false to true // you can have as many subscribers to this notification as you want and // they code that handles the notifications can be anywhere you want in your // code base as the notification handlers are registered with the subscribe method function myNotification(data) { alert("I got notified " + data); }

jsFiddle: http://jsfiddle.net/jfriend00/PYJef/

+2
source 
 function menuReady(){ // Do whatever it is you need done when menu is ready } $(...).load(..., function() { menuReady();// menuReady is called on callback });
+1
source

Why not create a menuReady function that will run when you want?

 menuReady();
0
source 
 Utils = { eventRegister_globalVariable : function(variableName,handlers){ eventRegister_JsonVariable(this,variableName,handlers); }, eventRegister_jsonVariable : function(jsonObj,variableName,handlers){ if(jsonObj.eventRegisteredVariable === undefined) { jsonObj.eventRegisteredVariable={};//this Object is used for trigger event in javascript variable value changes ku } Object.defineProperty(jsonObj, variableName , { get: function() { return jsonObj.eventRegisteredVariable[variableName] }, set: function(value) { jsonObj.eventRegisteredVariable[variableName] = value; handlers(jsonObj.eventRegisteredVariable[variableName]);} }); }
0
source

Source: https://habr.com/ru/post/893320/

More articles:


All Articles