我正在开发 Microsoft Dynamics 365 CRM 门户,但尽管如此,我还是尝试包含一个 Sweet Alert 2按下按钮时的模态。
它适用于大多数浏览器(Chrome、Firefox 和 Edge),但适用于 Internet Explorer 11。
这是我要部署的全部代码:
<a href="#" id="searchHelp">
<img border="0" src="http://some.url" alt="?" width="15" height="15">
</a>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script lang="javascript">
console.log("Javascript loaded");
var helpButton = document.querySelector('#searchHelp');
if(navigator.userAgent.indexOf(".NET") >= 0) {
console.log('Triggered IE Modal actions');
helpButton.attachEvent('onclick', function(e) {
e.returnValue = false;
loadModal();
});
} else {
console.log('Triggered non-IE Modal actions');
helpButton.addEventListener('click', (e) => {
e.preventDefault();
loadModal();
}, false)
}
function loadModal() {
var xhr = new XMLHttpRequest();
xhr.open( "GET", "http://some.url/to-load", false);
xhr.setRequestHeader("Accept", "text/html");
xhr.setRequestHeader("Content-Type", "text/html; charset=utf-8");
xhr.onreadystatechange = function() {
if(this.readyState == 4) {
xhr.onreadystatechange = null;
if(this.status == 200) {
var parser = new DOMParser(),
content = parser.parseFromString(this.response, "text/html"),
form = content.querySelector('#liquid_form');
swal({
icon: "info",
content: form,
button: {
text: "Close",
value: false,
visible: true,
className: "",
closeModal: true,
}
})
}
}
};
xhr.send();
}
</script>
<style>
.swal-modal {
width: 90% !important;
}
.swal-content {
overflow: hidden;
}
</style>
模式在我之前提到的所有浏览器上运行良好,但单击按钮时不会触发任何操作。它会转到页面顶部,并且会在 URL 中添加一个主题标签。消息“Javascript 已加载”也未显示。
我尝试提高浏览器兼容性:我已将 fetch()
更改为 XMLHttpRequest
并通过在 Developer Tools 控制台上进行测试来添加浏览器验证,添加了 attachEvent()
和 addEventListener()
。我确实也尝试过在标签中包含 type="javascript"
。有什么线索吗?
最佳答案
IE11 不支持 =>
箭头函数,有条件地使用它们是行不通的,因为即使在您当前的代码中执行不会到达它们,作为一个整体,JavaScript 是不可解析的通过不兼容 ES6 的浏览器,如 IE。
切换到传统的 function(e) { ... }
语法。
关于javascript - 内联 Javascript 未在 IE11 上加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51067451/