我收到错误 Uncaught TypeError: Cannot set property 'onclick' of null
2018-10-19
1010
我有一个 Facebook 自定义按钮共享代码。我收到此错误:
Uncaught TypeError: Cannot set property 'onclick' of null in console.
document.getElementById('piggy-bank-fb-shear-btn', 'piggy-bank-fb-shear-btn-2').onclick = function () {
FB.ui({
method: 'share',
display: 'popup',
app_id: '{827182594132839}',
href: window.fbSheareUrl,
}, function (response) {
debugger;
if (response && !response.error_message) {
var element = document.getElementById("attach-email");
element.style.display = "block";
document.getElementById('close','close2').click();
}
else {
var element = document.getElementById("attach-email");
document.getElementById('close', 'close2').click();
element.style.display = "block";
document.getElementById('share-poup-text').innerHTML = getLanguageWordByKey('PiggyBankShareUnsuccessfulPopUp');
element.classList.remove("mystyle");
document.getElementById('piggy-share-icon').classList.remove('email-success');
document.getElementById('piggy-share-icon').classList.add('email-failed');
}
});
}
scrtipt 在 html 文档末尾实现。
3个回答
错误出现在第一行:
document.getElementById('piggy-bank-fb-shear-btn', 'piggy-bank-fb-shear-btn-2')
document.getElementById()
每次仅支持一个 ID。
如果您想定位多个 ID,请使用
document.querySelectorAll()
,它将返回具有指定 ID 的节点列表:
https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll
或者,如果可能的话,您还可以向元素添加一个通用类,并使用
document.getElementsByClassName()
定位该类,它将返回具有该类的节点列表类:
https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName
例如:
var buttons = document.querySelectorAll('#piggy-bank-fb-shear-btn, #piggy-bank-fb-shear-btn-2');
Array.from(buttons).forEach(button => {
button.addEventListener('click', function(event) {
FB.ui({
method: 'share',
display: 'popup',
app_id: '{827182594132839}',
href: window.fbSheareUrl,
}, function (response) {
debugger;
if (response && !response.error_message) {
var element = document.getElementById("attach-email");
element.style.display = "block";
document.getElementById('close','close2').click();
}
else {
var element = document.getElementById("attach-email");
document.getElementById('close', 'close2').click();
element.style.display = "block";
document.getElementById('share-poup-text').innerHTML = getLanguageWordByKey('PiggyBankShareUnsuccessfulPopUp');
element.classList.remove("mystyle");
document.getElementById('piggy-share-icon').classList.remove('email-success');
document.getElementById('piggy-share-icon').classList.add('email-failed');
}
});
});
});
Rence
2018-10-19
您可以使用
document.getElementById
一次性获取单个元素。因此,您可以将元素的
id
保存在数组中,并将事件侦听器附加到该数组中
['piggy-bank-fb-shear-btn', 'piggy-bank-fb-shear-btn-2'].forEach(function(item){
document.getElementById(item).onclick==//rest of code
})
brk
2018-10-19
var clickfnc = function() {
}
document.getElementById('piggy-bank-fb-shear-btn').onclick =clickfnc
document.getElementById('piggy-bank-fb-shear-btn-2').onclick =clickfnc
hossein sedighian
2018-10-19