0

I want to "disable" a Javascript function when my input is focused. Disable might be the wrong term but I simply want to stop a function from working. I have something like the following in mind except the dislable. of course.

input = document.getElementById("input");
if (input.focus()) {
    disable.expand();
}
function expand() {
const gridItems = document.querySelectorAll(".grid-item");
const collapsings = document.querySelectorAll(".collapsing");
for (let i = 0; i < gridItems.length; i++) {
    gridItems[i].addEventListener("mouseenter", () => {
        gridItems[i].style.width = "400px";
        collapsings[i].style.maxHeight = collapsings[i].scrollHeight + "px";
    });
    gridItems[i].addEventListener("mouseleave", () => {
        gridItems[i].style.width = null;
        collapsings[i].style.maxHeight = null;
    });
}

}

Is something like this possible?

7
  • 2
    To me this seems to be an XY problem You don't need to disable a function, just don't call it Commented Nov 12, 2018 at 9:01
  • 1
    You need to provide a little more context: what does the function do? Is it an interval/polling function that runs every x seconds? Is it a promise/async function? What does it do? "Disabling" a function can mean many things, given the ambiguous context. Commented Nov 12, 2018 at 9:01
  • i edited the question Commented Nov 12, 2018 at 9:03
  • If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier? Commented Nov 12, 2018 at 9:07
  • just add a return statement in your expand function : if (input.focus()) return; Commented Nov 12, 2018 at 9:09

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.