忽略特定div元素的onclick
[英]Ignore onclick on specific div element
問題描述
<pre>
<head>
....
</head>
<body>
<script src="Puzzle.js"></script>
<button id="button1" onclick="numbersDisplay();">Start New Game</button>
<div id="tableDiv" >
</div>
</pre>
我想做的只是用if else語句忽略對特定div元素的onclicks。
if else語句運行正常，但我不知道如何忽略點擊...
如果只是為了防止用戶單擊div元素，我只希望某個div做出可能的動作，這就是我正在做的難題
for (var i = 0; i < table.length; i++) {
for (var j = 0; j < table.length; j++) {
output += '<div id="' + i + j + '" onclick="tableMove(this,\'' + table[i][j] + '\')">' + table[i][j] + '</div>';
}
}
document.getElementById('tableDiv').innerHTML = output;
var search = document.querySelector('div').childNodes;
var array = [].slice.call(search);
for (var c in array) {
elements = array[c];
if (elements.textContent === '0') {
zero = elements.id;
document.getElementById(zero).innerHTML = '';
i1 = zero[0];
j1 = zero[1];
posZero = table[i1][j1];
}
}
}
function tableMove(num, val) {
i2 = num.id[0];
j2 = num.id[1];
table[i1][j1] = table[i2][j2];
table[i2][j2] = posZero;
if (i1 !== i2 && j1 !== j2) {
document.getElementById(num.id).removeEventListener("click", tableMove);//<---this dont work in all if else if statements
else if((i1=Number(i1)+1) === i2 && j1 === j2 ){
document.getElementById(num.id).removeAttribute("onclick");
}
else if((i1=Number(i1)-1) === i2 && j1 === j2){
document.getElementById(num.id).removeAttribute("onclick");
}
else if((j1 = Number(j1)+1) === j2 && i1 === i2){
document.getElementById(num.id).removeAttribute("onclick");
}
else if((j1 = Number(j1)-1) === j2 && i1 === i2){
document.getElementById(num.id).removeAttribute("onclick");
}
return numbersDisplay();
}
2 個解決方案
解決方案1
0 2018-01-14 18:26:07
我用與您的情況類似的藍色div進行了示例。
單擊div時，它將執行JS並調用事件StopPropagation。
document.querySelector('.div').addEventListener( "click", function(e){ document.querySelector('p').innerHTML = "Do your if/else code here!"; e.stopPropagation(); }, true )
div { display: inline-block; width: 120px; height: 120px; background: blue; margin: 7px; }
<div class="div"> </div> <p> Click on blue div, it will call the JS </p>
解決方案2
0 2018-01-14 19:05:57
只是為您無法點擊的div使用特定的類？ 例如
.unclickable {
pointer-events: none;
}
調用特定的div onclick
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.