0

I'm new in using Jquery window and I Just want to ask because I'm so confused if I am using the addEventListener and removeEventListener correctly?

I just want to remove the DOMContentLoaded when I selected the tab that is not the 3rd Tab. How can I check if the eventListener is removed? Thanks enter code here

var currentTabIndex =  $("#example-tabs").steps("getCurrentIndex").val();

if(currentTabIndex == 2){
                AddDomContentLoaded();
                }
                else{
                RemoveDomContentLoaded();
                }

function AddDomContentLoaded() {
            window.addEventListener("DOMContentLoaded", GetDomContentLoaded(), false);
        }

    function RemoveDomContentLoaded() {
            window.removeEventListener("DOMContentLoaded", GetDomContentLoaded());
        }

    function GetDomContentLoaded() {
                var video = document.getElementById("video");
                function successCallback(stream) {
                    // Set the source of the video element with the stream from the camera
                    if (video.mozSrcObject !== undefined) {
                        video.mozSrcObject = stream;
                    } else {
                        //video.src =  (window.URL && window.URL.createObjectURL(stream)) || stream;
                        //                var binaryData = [];
                        //                binaryData.push(data);
                        //                window.URL.createObjectURL(new Blob(binaryData, { type: "application/zip" }))
                        video.srcObject = stream;

                    }
                    video.play();
                }

                function errorCallback(error) {
                    $('[id^="capture"]').hide();
                }

                navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
                window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;

                // Call the getUserMedia method with our callback functions
                if (navigator.getUserMedia) {
                    navigator.getUserMedia({ video: true }, successCallback, errorCallback);
                }
            }
Enrique Gil
  • 754
  • 4
  • 19
  • 50
  • 1
    Your issue is that you are calling/evaluating your `GetDomContentLoaded` function directly, rather than passing it to the addEventListener/removeEventListener methods. In your case this is the same as e.g: `window.addEventListener("DOMContentLoaded", undefined, false);`. Try replacing `GetDomContentLoaded()` with `GetDomContentLoaded` in both cases and it should work. – som Feb 11 '19 at 10:47
  • @som sir just like this? `window.addEventListener("DOMContentLoaded", GetDomContentLoaded, false);` as what I undestand in your comment – Enrique Gil Feb 11 '19 at 10:50
  • @som will it also work for the `removeEventListener` function? – Enrique Gil Feb 11 '19 at 10:50
  • 1
    That's correct. You want to pass the same function name to both `addEventListener` and `removeEventListener`. By including `()` at the end of the function name you are instead passing whatever the function returns (in this case undefined). – som Feb 11 '19 at 10:54
  • @som How will i know that the add and remove eventlistener works fine? – Enrique Gil Feb 12 '19 at 02:40
  • 1
    You'll know the add works fine if your function fires (maybe add a console.log into it). The remove is a bit harder to confirm, especially with `DomContentLoaded`. If your syntax is correct and the add works you can probably assume the remove is also working. Otherwise it might be worth checking out https://stackoverflow.com/q/446892/720204 – som Feb 12 '19 at 03:20
  • Thank you very much for the very informative answers sir @som , Gonna check the link youve provided – Enrique Gil Feb 12 '19 at 03:32

0 Answers0