Why won't this code work in IE11, Chrome, Firefox, but will work in IE8?
Question
My developer at work tossed me a small template so I could edit it and make a mockup for a work thing. When he created it, it worked just fine; he made it in IE8. When he emailed it to me and I opened it in IE11/Chrome/Firefox no go. Any assistance?
<!DOCTYPE html> <html> <head> <script> function handleVisibility(box){ var visible = (box.checked) ? "block": "none"; box.parentElement.nextSibling.style.display = visible; } </script> </head> <body> <div id="divTransfer"> <input id="cbTransferRefer" type="checkbox" value="TransferRefer" onClick = "handleVisibility(this)">Transfer/Refer<br> </div> <div id="pTransferTypes" style="display:none" > Transfer Types: <select> <option value="referred">Referred</option> <option value="internalTaskForm">Escalated via Internal Task Form</option> <option value="cci">Escalated via CCI</option> <option value="pdf">Escalated via PDF Form</option> <option value="transferred">Transferred</option> </select> </div> <div id="divTemplate"> <input id="cbTemplateRefer" type="checkbox" value="TemplateRefer" onClick = "handleVisibility(this)">Template/Refer<br> </div> <div id="pTemplateTypes" style="display:none" > Template Types: <select> <option value="referred">Referred</option> <option value="internalTaskForm">Escalated via Internal Task Form</option> <option value="cci">Escalated via CCI</option> <option value="pdf">Escalated via PDF Form</option> <option value="transferred">Transferred</option> </select> </div> </body> </html>
1 answers
solution1
0 2016-08-10 20:52:25
You don't necessarily want the nextSibling , you want the nextElementSibling . If there is white-space after your parent element, the next sibling will be that white-space. As such, you would want to either remove all white-space between the element, and its sibling, or call nextElementSibling to guarantee you don't get a textNode.
It's worth noting that getElementSibling is only supported in IE 9 and above. But, if you need IE 8 support, you can simply remove the white-space, keeping nextSibling , or leverage a polyfill .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.