Disable a Javascript function when input is focused [duplicate]
0
This question already has an answer here:
How do I find out which DOM element has the focus?
16 answers
Javascript detect if input is focused [duplicate]
4 answers
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?
javascript
asked Nov 12 at 8:58
W.Tf
11
marked as duplicate by Just code, Bergi javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 12 at 9:01
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
|
show 2 more comments
0
This question already has an answer here:
How do I find out which DOM element has the focus?
16 answers
Javascript detect if input is focused [duplicate]
4 answers
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?
javascript
asked Nov 12 at 8:58
W.Tf
11
marked as duplicate by Just code, Bergi javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 12 at 9:01
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
2
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 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.
– Terry
Nov 12 at 9:01
i edited the question
– W.Tf
Nov 12 at 9:03
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
just add a return statement in your expand function :if (input.focus()) return;
– scraaappy
Nov 12 at 9:09
|
show 2 more comments
0
0
0
This question already has an answer here:
How do I find out which DOM element has the focus?
16 answers
Javascript detect if input is focused [duplicate]
4 answers
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?
javascript
asked Nov 12 at 8:58
W.Tf
11
This question already has an answer here:
How do I find out which DOM element has the focus?
16 answers
Javascript detect if input is focused [duplicate]
4 answers
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?
This question already has an answer here:
How do I find out which DOM element has the focus?
16 answers
Javascript detect if input is focused [duplicate]
4 answers
javascript
javascript
asked Nov 12 at 8:58
W.Tf
11
asked Nov 12 at 8:58
W.Tf
11
edited Nov 12 at 9:02
asked Nov 12 at 8:58
W.Tf
11
asked Nov 12 at 8:58
W.Tf
11
asked Nov 12 at 8:58
W.Tf
11
11
marked as duplicate by Just code, Bergi javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 12 at 9:01
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
marked as duplicate by Just code, Bergi javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 12 at 9:01
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
2
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 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.
– Terry
Nov 12 at 9:01
i edited the question
– W.Tf
Nov 12 at 9:03
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
just add a return statement in your expand function :if (input.focus()) return;
– scraaappy
Nov 12 at 9:09
|
show 2 more comments
2
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 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.
– Terry
Nov 12 at 9:01
i edited the question
– W.Tf
Nov 12 at 9:03
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
just add a return statement in your expand function :if (input.focus()) return;
– scraaappy
Nov 12 at 9:09
2
2
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 at 9:01
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 at 9:01
1
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.
– Terry
Nov 12 at 9:01
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.
– Terry
Nov 12 at 9:01
i edited the question
– W.Tf
Nov 12 at 9:03
i edited the question
– W.Tf
Nov 12 at 9:03
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
just add a return statement in your expand function :
if (input.focus()) return;– scraaappy
Nov 12 at 9:09
just add a return statement in your expand function :
if (input.focus()) return;– scraaappy
Nov 12 at 9:09
|
show 2 more comments
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
2
To me this seems to be an XY problem You don't need to disable a function, just don't call it
– Cid
Nov 12 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.
– Terry
Nov 12 at 9:01
i edited the question
– W.Tf
Nov 12 at 9:03
If you're only changing stylings inside the event handlers, won't a CSS :hover and :focus class be easier?
– Shilly
Nov 12 at 9:07
just add a return statement in your expand function :
if (input.focus()) return;– scraaappy
Nov 12 at 9:09