IE11 selectionchange event activeTarget changes activeTarget when logged
up vote
0
down vote
favorite
Im trying to get the activeTarget of the selectionChange event in IE11 when using the inbuilt search to step through the matches. In firefox and Edge the follow code will log the the element closest to where the element is. So the input "test test" would return the link element.
In IE11 the log of the whole event will contain the anchor element in the target -> activeElement but when you try to log it it will log event.target.activeElement the body element be logged instead.
Does anyone know what might be going on and/or how to work around this issue? Helps much appreciated.
html:
<html>
<body>
<div class="block display-option-100 expandedblock">
<div class="expand-block block__generic-body" data-expandblock>
<div class="block__row">
<div tabindex="0" class="expand-block__clickable-row" role="tab" aria-controls="114428">
<h2 class="block__heading expand-block__heading ">H55445DEerpfsdfdfs</h2>
<span class="expand-block__statuslabel" data-nojs-hidden>
<span class="statuslabel__open"></span>
<span class="statuslabel__close"></span>
</span>
</div>
<div id="114428" class="expand-block__content" data-expandblockcontent role="tabpanel" aria-expanded="false">
<p><a title="Här testar vi" href="/testi/">Testitesti Rapport</a></p>
<p> </p>
<p><a href="test">herpderp test test</a><br><a href="herp derp">test test jfdsnjdnjf <br></a><a href="fdgfdghfgfdfdg">test tastdsoin tstest</a><br><a href="gfdgfdgfdgfd">yat yat yat yta ggdsggd</a></p>
</div>
</div>
</div>
</div>
</body>
</html>
JavaScript
document.addEventListener("selectionchange", function(e)
console.log("Selection-change Log");
//e.stopPropagation();
console.log(e);
console.warn(e.target.activeElement);
);
javascript internet-explorer javascript-events
asked Nov 8 at 14:17
Alun
92
add a comment |
up vote
0
down vote
favorite
Im trying to get the activeTarget of the selectionChange event in IE11 when using the inbuilt search to step through the matches. In firefox and Edge the follow code will log the the element closest to where the element is. So the input "test test" would return the link element.
In IE11 the log of the whole event will contain the anchor element in the target -> activeElement but when you try to log it it will log event.target.activeElement the body element be logged instead.
Does anyone know what might be going on and/or how to work around this issue? Helps much appreciated.
html:
<html>
<body>
<div class="block display-option-100 expandedblock">
<div class="expand-block block__generic-body" data-expandblock>
<div class="block__row">
<div tabindex="0" class="expand-block__clickable-row" role="tab" aria-controls="114428">
<h2 class="block__heading expand-block__heading ">H55445DEerpfsdfdfs</h2>
<span class="expand-block__statuslabel" data-nojs-hidden>
<span class="statuslabel__open"></span>
<span class="statuslabel__close"></span>
</span>
</div>
<div id="114428" class="expand-block__content" data-expandblockcontent role="tabpanel" aria-expanded="false">
<p><a title="Här testar vi" href="/testi/">Testitesti Rapport</a></p>
<p> </p>
<p><a href="test">herpderp test test</a><br><a href="herp derp">test test jfdsnjdnjf <br></a><a href="fdgfdghfgfdfdg">test tastdsoin tstest</a><br><a href="gfdgfdgfdgfd">yat yat yat yta ggdsggd</a></p>
</div>
</div>
</div>
</div>
</body>
</html>
JavaScript
document.addEventListener("selectionchange", function(e)
console.log("Selection-change Log");
//e.stopPropagation();
console.log(e);
console.warn(e.target.activeElement);
);
javascript internet-explorer javascript-events
asked Nov 8 at 14:17
Alun
92
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
Im trying to get the activeTarget of the selectionChange event in IE11 when using the inbuilt search to step through the matches. In firefox and Edge the follow code will log the the element closest to where the element is. So the input "test test" would return the link element.
In IE11 the log of the whole event will contain the anchor element in the target -> activeElement but when you try to log it it will log event.target.activeElement the body element be logged instead.
Does anyone know what might be going on and/or how to work around this issue? Helps much appreciated.
html:
<html>
<body>
<div class="block display-option-100 expandedblock">
<div class="expand-block block__generic-body" data-expandblock>
<div class="block__row">
<div tabindex="0" class="expand-block__clickable-row" role="tab" aria-controls="114428">
<h2 class="block__heading expand-block__heading ">H55445DEerpfsdfdfs</h2>
<span class="expand-block__statuslabel" data-nojs-hidden>
<span class="statuslabel__open"></span>
<span class="statuslabel__close"></span>
</span>
</div>
<div id="114428" class="expand-block__content" data-expandblockcontent role="tabpanel" aria-expanded="false">
<p><a title="Här testar vi" href="/testi/">Testitesti Rapport</a></p>
<p> </p>
<p><a href="test">herpderp test test</a><br><a href="herp derp">test test jfdsnjdnjf <br></a><a href="fdgfdghfgfdfdg">test tastdsoin tstest</a><br><a href="gfdgfdgfdgfd">yat yat yat yta ggdsggd</a></p>
</div>
</div>
</div>
</div>
</body>
</html>
JavaScript
document.addEventListener("selectionchange", function(e)
console.log("Selection-change Log");
//e.stopPropagation();
console.log(e);
console.warn(e.target.activeElement);
);
javascript internet-explorer javascript-events
asked Nov 8 at 14:17
Alun
92
Im trying to get the activeTarget of the selectionChange event in IE11 when using the inbuilt search to step through the matches. In firefox and Edge the follow code will log the the element closest to where the element is. So the input "test test" would return the link element.
In IE11 the log of the whole event will contain the anchor element in the target -> activeElement but when you try to log it it will log event.target.activeElement the body element be logged instead.
Does anyone know what might be going on and/or how to work around this issue? Helps much appreciated.
html:
<html>
<body>
<div class="block display-option-100 expandedblock">
<div class="expand-block block__generic-body" data-expandblock>
<div class="block__row">
<div tabindex="0" class="expand-block__clickable-row" role="tab" aria-controls="114428">
<h2 class="block__heading expand-block__heading ">H55445DEerpfsdfdfs</h2>
<span class="expand-block__statuslabel" data-nojs-hidden>
<span class="statuslabel__open"></span>
<span class="statuslabel__close"></span>
</span>
</div>
<div id="114428" class="expand-block__content" data-expandblockcontent role="tabpanel" aria-expanded="false">
<p><a title="Här testar vi" href="/testi/">Testitesti Rapport</a></p>
<p> </p>
<p><a href="test">herpderp test test</a><br><a href="herp derp">test test jfdsnjdnjf <br></a><a href="fdgfdghfgfdfdg">test tastdsoin tstest</a><br><a href="gfdgfdgfdgfd">yat yat yat yta ggdsggd</a></p>
</div>
</div>
</div>
</div>
</body>
</html>
JavaScript
document.addEventListener("selectionchange", function(e)
console.log("Selection-change Log");
//e.stopPropagation();
console.log(e);
console.warn(e.target.activeElement);
);
javascript internet-explorer javascript-events
javascript internet-explorer javascript-events
asked Nov 8 at 14:17
Alun
92
asked Nov 8 at 14:17
Alun
92
asked Nov 8 at 14:17
Alun
92
asked Nov 8 at 14:17
Alun
92
asked Nov 8 at 14:17
Alun
92
92
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
up vote
0
down vote
I tried it on both browsers, and it works consistently.
However, the element needs to have tabindex to be defined as boundary of the activeElement, maybe that is why you saw body element.
For this it seems to be working on IE11 as well,
<p width="100%"><a tabindex="0" style="width:100%; display:inline-block;" title="Här testar vi"><span>Testitesti Rapport</span></a></p>
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
add a comment |
up vote
0
down vote
Solved it by using document.getSelection() and then selection.anchorNode.parentNode to get the active element instead if using the event to get the relevant element.
As seen in the example here: https://chrisdavidmills.github.io/selection-api-examples/
answered Nov 9 at 9:03
Alun
92
add a comment |
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
I tried it on both browsers, and it works consistently.
However, the element needs to have tabindex to be defined as boundary of the activeElement, maybe that is why you saw body element.
For this it seems to be working on IE11 as well,
<p width="100%"><a tabindex="0" style="width:100%; display:inline-block;" title="Här testar vi"><span>Testitesti Rapport</span></a></p>
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
add a comment |
up vote
0
down vote
I tried it on both browsers, and it works consistently.
However, the element needs to have tabindex to be defined as boundary of the activeElement, maybe that is why you saw body element.
For this it seems to be working on IE11 as well,
<p width="100%"><a tabindex="0" style="width:100%; display:inline-block;" title="Här testar vi"><span>Testitesti Rapport</span></a></p>
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
add a comment |
up vote
0
down vote
up vote
0
down vote
I tried it on both browsers, and it works consistently.
However, the element needs to have tabindex to be defined as boundary of the activeElement, maybe that is why you saw body element.
For this it seems to be working on IE11 as well,
<p width="100%"><a tabindex="0" style="width:100%; display:inline-block;" title="Här testar vi"><span>Testitesti Rapport</span></a></p>
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I tried it on both browsers, and it works consistently.
However, the element needs to have tabindex to be defined as boundary of the activeElement, maybe that is why you saw body element.
For this it seems to be working on IE11 as well,
<p width="100%"><a tabindex="0" style="width:100%; display:inline-block;" title="Här testar vi"><span>Testitesti Rapport</span></a></p>
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
answered Nov 8 at 17:44
ad1988
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
answered Nov 8 at 17:44
ad1988
11
answered Nov 8 at 17:44
ad1988
11
11
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
ad1988 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
add a comment |
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
Thanks for your response! This didnt help me it seems though. I get it to return the correct element selecting or highlighting stuff manually. I don't however get it to work when stepping through the search results. Does that work for you? It's still containing the Anchorelement when logging the whole event but when trying the log only that specifik element within the event it logs the body-element. Did you do anything else other than adding tabindex?
– Alun
Nov 9 at 7:00
add a comment |
up vote
0
down vote
Solved it by using document.getSelection() and then selection.anchorNode.parentNode to get the active element instead if using the event to get the relevant element.
As seen in the example here: https://chrisdavidmills.github.io/selection-api-examples/
answered Nov 9 at 9:03
Alun
92
add a comment |
up vote
0
down vote
Solved it by using document.getSelection() and then selection.anchorNode.parentNode to get the active element instead if using the event to get the relevant element.
As seen in the example here: https://chrisdavidmills.github.io/selection-api-examples/
answered Nov 9 at 9:03
Alun
92
add a comment |
up vote
0
down vote
up vote
0
down vote
Solved it by using document.getSelection() and then selection.anchorNode.parentNode to get the active element instead if using the event to get the relevant element.
As seen in the example here: https://chrisdavidmills.github.io/selection-api-examples/
answered Nov 9 at 9:03
Alun
92
Solved it by using document.getSelection() and then selection.anchorNode.parentNode to get the active element instead if using the event to get the relevant element.
As seen in the example here: https://chrisdavidmills.github.io/selection-api-examples/
answered Nov 9 at 9:03
Alun
92
answered Nov 9 at 9:03
Alun
92
answered Nov 9 at 9:03
Alun
92
answered Nov 9 at 9:03
Alun
92
92
add a comment |
add a comment |
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53209606%2fie11-selectionchange-event-activetarget-changes-activetarget-when-logged%23new-answer', 'question_page');
);
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
