Question

我有五个问题，每个问题都隐藏在编号为1-5的方框中，一旦用户从1 - 5中选择一个数字，选中的框将会弹出问题.. 如果用户按下右键，我想知道如何删除所选的框，如果是左键，它只会弹出一个大的X标记。

<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>

Answer 1

使用jQuery删除元素，在本例中为div，使用：

$('div').remove();

然后要显示复选标记，请将其作为另一个元素，可能位于带有CSS的div下方：display:none; 然后删除div，再次使用jQuery

显示它

$('checkMark').show();

使用箭头键删除div

1 个答案: