3
我有五個問題,並且每個問題都隱藏在編號爲1-5的框中,一旦用戶從1 - 5中選擇一個數字,所選框將彈出問題.. 我想知道如何刪除選定框,如果用戶按下右鍵,如果左鍵會做什麼,但彈出一個大X標記..使用箭頭鍵刪除div
<script type="text/javascript">
function Question1(){
document.getElementById('Question').innerHTML = 'Question#1';
}
function Question2(){
document.getElementById('Question').innerHTML = 'Question#2';
}
function Question3(){
document.getElementById('Question').innerHTML = 'Question#3';
}
function Question4(){
document.getElementById('Question').innerHTML = 'Question#4';
}
function Question5(){
document.getElementById('Question').innerHTML = 'Question#5';
}
function showArrowKey(e) {
arrowKey = e.which||e.keyCode;
switch(arrowKey) {
case 37: //left key
//Do nothing just pop up Big X mark
break;
case 39: //right key
// Remove the selected div, and pop up Check mark
break;
}
}
</script>
<div class = "container">
<div id = "CompleteImage">
<div class = "squareInside" id="trigger-overlay1" onclick='Question1()'>1</div>
<div class = "squareInside" id="trigger-overlay2" onclick='Question2()'>2</div>
<div class = "squareInside2" id="trigger-overlay3"onclick='Question3()'>3</div>
<div class = "squareInside2" id="trigger-overlay4"onclick='Question4()'>4</div>
<div class = "squareInside2" id="trigger-overlay5"onclick='Question5()'>5</div>
</div>
</div> <!-- container -->
<div class="overlay overlay-door" >
<button type="button" class="overlay-close">Close</button>
<nav>
<ul>
<li><p id='Question' ></p></li>
</ul>
</nav>
</div>