Can An Event Listener Be Pressed Into Service As a Potential Input, By Assigning A Value, IF, It Gets RUN?

Question

What I am attempting to discover is how to set a value when the function inside and Event Listener gets executed. If that can be done, then that value, could be used to control other potential actions. Not having found precise material about this, I have been experimenting. The below code, doesn't raise any alarms with the Chrome JS Console, and it does perform the alert(77) when the mouse leaves MoscowNights Div, but there is no value on the backend of the whole claptrap codeblock.

function IsolateThaBUG() {
  var MoscowNights = document.getElementById("MoscowNights");

  MoscowNights.addEventListener("mouseout", function(evt) {
    var MaloMaloJavaScript = 77;
    alert(MaloMaloJavaScript);
    return MaloMaloJavaScript;
  }, false);

  var Convoluted = MoscowNights;
  return Convoluted;
}

var GotAnythingYET = IsolateThaBUG();
alert('Got This NONSENSE Instead : ' + GotAnythingYET);

---

Right, well... this next block also does not give up a value... or so it would seem. If it was accessible, it should be showing up in the div, but it reads undefined so... maybe there is no way to do this in one go.

    function IsolateThaBUG(){
       var MoscowNights = document.getElementById('MoscowNights');
        var MaloMaloJavaScript; // temp undefnd
        MoscowNights.addEventListener("mouseout", function (evt) {
            var MaloMaloJavaScript=77;   <<<<<<<<<<<<<<<<<<<<<<<    THAT,
            }, false);
        return MaloMaloJavaScript;   >>>>>>>>>>>>    is just NOT getting OUTSIDE!!
    }
     var GotAnythingYET = IsolateThaBUG();
     function WritetestValue() {
        var artfulArtificial = document.getElementById("whattheSAMHILLsigoinon");
        var TitleWrite = artfulArtificial.appendChild(document.createTextNode(testValue));
        return TitleWrite;
    }
    WritetestValue();

The answer I accepted, does the job as I discovered when I studied it, got it installed and tested it.

Answer 1

The function you wrote IsolateThaBug is returning the value of MoscowNights, which is an element.

I'm surmising that you wish to retrieve the value of MaloMaloJavascript. In order to accomplish this, you need to pass in a callback or some other variable with which to mutate.

Here are a few examples.

function testMouseout() {
  var element = document.getElementById('MoscowNights'); 
  var testValue;  // undefined currently.
  element.addEventListener('mouseout', function(e) {
    testValue = 77;
  }, false);
  return testValue;
}

var mouseoutTest = testMouseout(); 
console.log(mouseoutTest); // undefined
// perform the mouseout action. If you did, the value will be 77.
window.setTimeout(function(){
  console.log(mouseoutTest) // 77
}, 5000)

If you want to wait till fire the alert until the mouseout has happened, you can pass in a callback function. This takes advantage of JavaScript's first-class functions.

function testMouseout(callback) {
  var element = document.getElementById('MoscowNights'); 
  var testValue;  // undefined currently.
  element.addEventListener('mouseout', function(e) {
    testValue = 77;
    callback(testValue);
  }, false);
  return testValue;
}

// we pass in a function that will 
// be executed when the event fires.
testMouseout(function(value) {
  alert(value); // 77
});