Javascript - Bytt Divs på KeyDown

stemmer
1

Jeg kan bytte to divs ved å klikke på en link, som vist i følgende kode, men hvordan kan jeg bytte dem ved å trykke på en tast?

Dette er hva jeg har:

function SwapDivs(div1, div2) {
        d1 = document.getElementById(div1);
        d2 = document.getElementById(div2);
        if (d2.style.display == none) {
            d1.style.display = none;
            d2.style.display = block;
        } else {
            d1.style.display = block;
            d2.style.display = none;
        }
    }
<p>
    <a href=javascript:SwapDivs('FirstDiv','SecondDiv')>Swap Divs</a>
</p>


<div id=FirstDiv style=display:block>
    <p>
        This div is displayed when the page opens.
    </p>
</div>

<div id=SecondDiv style=display:none>
    <p>
        This div is displayed when the link is clicked.
    </p>
</div>

Jeg har brukt onkeydown før, men jeg kan ikke finne ut hvordan du skal bruke det her ...

Dette fungerer bare ikke:

    document.body.addEventListener(keydown, function(event) {
        if (event.keyCode === 32) {
            function SwapDivs(div1, div2);
        }
    });

Publisert på 19/09/2018 klokken 13:22
kilden bruker
På andre språk...                            


1 svar

stemmer
2

  1. Hvis du ringer en funksjon du ikke skrive "-funksjonen" søkeord før det.

  2. Du passerte to ikke-eksisterende variabler kalt div1og div2i funksjonen SwapDivssom ble kalt inne i arrangementet lytteren.

  3. Hvis du legger til en aktivitetslytter til kroppen, må du legge til <body>koden.

Som et eksempel jeg brukte "Pil ned Key", som har nøkkelkode 40.

    document.body.addEventListener("keydown", function(event) {
        if (event.keyCode === 40) {
           SwapDivs('FirstDiv','SecondDiv');
        }
    });

Her er en codepen: https://codepen.io/anon/pen/MqZomW

Svarte 19/09/2018 kl. 13:24
kilden bruker

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more