मेरे पास एचटीएमएल प्रस्तुति स्लाइड प्लेयर के लिए यह कोड है, लेकिन परिवर्तनीय "बी" किसी भी तरह से संख्याएं जोड़ रहा है, और मुझे यह पता लगाना प्रतीत नहीं होता है।

function loadSong(songname){
    b = 1;
    console.log(b);
    var html = slidehtml(songname,b);
    if(vr_on){
        vr.innerHTML = html;
    }
    display.innerHTML = html;
    window.addEventListener("keydown", function(){
        if(event.which == 37){
            b = b - 1;
            if(b <= 0){b = 1;}
            if(vr_on){
                vr.innerHTML = slidehtml(songname,b);
            }
            display.innerHTML = slidehtml(songname,b);
            console.log(b);
        }
        if(event.which == 39){
            b = b + 1;
            if(b > song_count(songname)){b = song_count(songname);}
            if(vr_on){
                vr.innerHTML = slidehtml(songname,b);
            }
            console.log(b);
            display.innerHTML = slidehtml(songname,b);
        }
    });
 }

साथ ही, ऊपर लिपि में उपयोग किए जाने वाले अन्य कार्य यहां दिए गए हैं

function song_count(a){
    if(a == 'pitb'){return 8;}
    if(a == 'hgta'){return 16;}
    if(a == 'hpdo'){return 4;}
    if(a == 'ismp'){return 8;}
    if(a == 'saip'){return 8;}
    if(a == 'ogsj'){return 8;}
    if(a == 'torc'){return 12;}
    if(a == 'sufj'){return 6;}
    if(a == 'tmlb'){return 4;}
    if(a == 'gwsn'){return 2;}
    if(a == 'jlm0'){return 6;}
    if(a == 'tpoc'){return 8;}
    if(a == 'wisc'){return 4;}
    if(a == 'ynic'){return 13;}
    if(a == 's_fs'){return 40;}
}
function showSlide(a) {
    var c = "<img src='slides/" + a + ".jpeg'>";
    if(vr_on){
        vr.innerHTML = c;
    }
    display.innerHTML = c;
 }

मुझसे यहां क्या गलत हो रहा है?

साथ ही, यह ठीक काम करता है अगर song_count('pitb'); लेकिन नहीं अगर song_count('ismp');

यहाँ पूरा कोड है:

<!DOCTYPE html>
<html>
    <head>
        <title>Display</title>
    </head>
    <body id='con'>
        <style>
        .btn{
        background:grey;
        color:white;
        border-right:2px solid black;
        display:inline-block;
        padding:6px;
        padding-left:12px;
        padding-right:12px;
        }
        .menubar{width:calc(100% - 48px);
        margin-left:12px;}
        .btn:hover{
        background:black;
        cursor:pointer;
        }
        body{padding:0;margin:0;}
        #container,#viewer{
        width:50%;
        max-width:50%;
        position:absolute;
        min-height:100vh;
        top:0;
        }
        .sbtn{font-size:14pt;color:rgb(120,150,255);text-decoration:underline;}
        .sbtn:hover{color:rgb(100,120,200);cursor:pointer;}
        .songs{
        width:calc(100% - 48px);
        margin-left:12px;
        padding:12px;
        background:white;
        }
        img{width:100%;}
        #viewer{right:0;background:black;color:white;}
        #container{background:rgb(240,240,240);left:0;}
        </style>
        <div id="container">
            <h1 style="text-align:center">Controller Menu</h1>
            <div class='menubar'><div class='btn' onclick='home()'><p>Home</p></div><div class='btn' onclick='start()'><p>Start Countdown Video</p></div><div class='btn' onclick='mlv()'><p>Main Loop Video</p></div></div>
            <div class='songs'>
                <h1>Songs</h1>
                <div class='sbtn' onclick='loadSong("pitb")'><p>Song 1</p></div>
                <div class='sbtn' onclick='loadSong("hgta")'><p>Song 2</p></div>
                <div class='sbtn' onclick='loadSong("hpdo")'><p>Song 3</p></div>
                <div class='sbtn' onclick='loadSong("ismp")'><p>Song 4</p></div>
                <div class='sbtn' onclick='loadSong("ogsj")'><p>Song 5</p></div>
                <div class='sbtn' onclick='loadSong("sufj")'><p>Song 6</p></div>
                <div class='sbtn' onclick='loadSong("torc")'><p>Song 7</p></div>
                <div class='sbtn' onclick='loadSong("ynic")'><p>Song 8</p></div>
                <div class='sbtn' onclick='loadSong("tmlb")'><p>Song 9</p></div>
                <div class='sbtn' onclick='loadSong("gwsn")'><p>Song 10</p></div>
                <div class='sbtn' onclick='loadSong("jlm0")'><p>Song 11</p></div>
                <div class='sbtn' onclick='loadSong("tpoc")'><p>Song 12</p></div>
                <div class='sbtn' onclick='loadSong("wisc")'><p>Song 13</p></div>
            </div><br>

            <div class='songs'>
                <h1>Quick Message</h1>
                <div style="padding:8px;background:grey;color:white;margin-top:6px;" onclick="openQuickMessage()">Open quick message</div>
            </div><br>
        </div><div id='viewer'></div>
        <script>
            function song_count(a){
            if(a == 'pitb'){return 8;}
            if(a == 'hgta'){return 16;}
            if(a == 'hpdo'){return 4;}
            if(a == 'ismp'){return 8;}
            if(a == 'saip'){return 8;}
            if(a == 'ogsj'){return 8;}
            if(a == 'torc'){return 12;}
            if(a == 'sufj'){return 6;}
            if(a == 'tmlb'){return 4;}
            if(a == 'gwsn'){return 2;}
            if(a == 'jlm0'){return 6;}
            if(a == 'tpoc'){return 8;}
            if(a == 'wisc'){return 4;}
            if(a == 'ynic'){return 13;}
            if(a == 's_fs'){return 40;}
            }


            function createDisplay(a) {
                if(a === true) {
                    vr_on = true;
                    vr = document.getElementById('viewer');
                    vr.innerHTML = '<h1 style="text-align:center;">VR is on!</h1>';
                }
                else {
                    vr_on = false;
                }
                nwObj = window.open();
                nw = nwObj.document;
                nw.write('<!DOCTYPE html><html><head><title>Display</title></head><body><style>body{overflow:hidden;padding:0;margin:0;}#con{background:black;color:white;height:100vh;position:absolute;top:0;width:100%;max-width:100%;}img{width:100%;}.lds-roller{display:inline-block;position:relative;width:64px;height:64px;}.lds-roller div{animation:lds-roller 1.2s cubic-bezier(.5,0,.5,1) infinite;transform-origin:32px 32px}.lds-roller div:after{content:" ";display:block;position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;margin:-3px 0 0 -3px}.lds-roller div:nth-child(1){animation-delay:-36ms}.lds-roller div:nth-child(1):after{top:50px;left:50px}.lds-roller div:nth-child(2){animation-delay:-72ms}.lds-roller div:nth-child(2):after{top:54px;left:45px}.lds-roller div:nth-child(3){animation-delay:-108ms}.lds-roller div:nth-child(3):after{top:57px;left:39px}.lds-roller div:nth-child(4){animation-delay:-144ms}.lds-roller div:nth-child(4):after{top:58px;left:32px}.lds-roller div:nth-child(5){animation-delay:-.18s}.lds-roller div:nth-child(5):after{top:57px;left:25px}.lds-roller div:nth-child(6){animation-delay:-216ms}.lds-roller div:nth-child(6):after{top:54px;left:19px}.lds-roller div:nth-child(7){animation-delay:-252ms}.lds-roller div:nth-child(7):after{top:50px;left:14px}.lds-roller div:nth-child(8){animation-delay:-288ms}.lds-roller div:nth-child(8):after{top:45px;left:10px}@keyframes lds-roller{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}</style><div id="con"><p onclick="window.opener.fullscreen();">Fullscreen...</p><div style="position:absolute;left:50%;margin-left:-32px;top:50%;margin-top:-32px;"><div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></body></html>');
                nw.close();
                display = nw.getElementById('con');
            }
            function fullscreen() {
                display.requestFullscreen();
            }
            function sendmsg(){
                var a = "<br><br><br><br><h1 style='text-align:center'>" + qm.getElementById("msg").value + "</h1>";
                if(vr_on){
                    vr.innerHTML = a;
                }
                display.innerHTML = a;
            }
            function start(){
                display.innerHTML = '<video id="vid" src="out.mp4" style="width:100%;position:absolute;top:50%;transform: translateY(-50%);" preload="auto"></video>';
                nw.getElementById('vid').play();
                if(vr_on){
                    vr.innerHTML = '<video id="vid_vr" src="out.mp4" style="width:100%;" preload="auto" muted></video>';
                    document.getElementById('vid_vr').play();
                }
            }
            function mlv(){
                display.innerHTML = '<video id="vid1" src="out1.mp4" style="width:100%;top:50%;transform: translateY(-50%);" loop preload="auto"></video>';
                nw.getElementById('vid1').play();
                if(vr_on){
                    vr.innerHTML = '<video id="vid1_vr" src="out1.mp4" style="width:100%;position:absolute;top:50%;transform: translateY(-50%);" loop preload="auto" muted></video>';
                    document.getElementById('vid1_vr').play();
                }
            }
            function home(){
                if(vr_on){
                    vr.innerHTML = '<h1 style="text-align:center">Home</h1>';
                }
                display.innerHTML = '<h1 style="text-align:center">Home</h1>';
            }
            function showSlide(a) {
                var c = "<img src='slides/" + a + ".jpeg'>";
                if(vr_on){
                    vr.innerHTML = c;
                }
                display.innerHTML = c;
            }
            function loadSong(a){
                var b = 1;
                console.log("Start: " + b);
                var html = slidehtml(a,b);
                if(vr_on){
                    vr.innerHTML = html;
                }
                display.innerHTML = html;
                window.addEventListener("keydown", function(){
                    if(event.which == 37){
                        b = b - 1;
                        if(b <= 0){b = 1;}
                        if(vr_on){
                            vr.innerHTML = slidehtml(a,b);
                        }
                        display.innerHTML = slidehtml(a,b);
                        console.log(b);
                    }
                    if(event.which == 39){
                        console.log("Right: " + b);
                        b = b + 1;
                        if(b > song_count(a)){b = song_count(a);}
                        console.log("Right After: " + b);
                        if(vr_on){
                            vr.innerHTML = slidehtml(a,b);
                        }
                        console.log(b);
                        display.innerHTML = slidehtml(a,b);
                    }
                });
            }
            function quickMessageFocus() {
                qm.getElementById('msg').focus();
            }
            function openQuickMessage() {
                '<input id="msg" tpye="text" style="width:calc(100% - 12px);padding:6px;">';
                qmObj = window.open('about:blank','quickMessage','toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=500px,height=70px');
                qm = qmObj.document;
                qm.write('<!DOCTYPE html><html><head><title>Quick Message</title></head><body onload="window.opener.quickMessageFocus()" ><style>body{overflow:hidden;padding:0;margin:0;}#qm{background:white;color:black;height:100vh;position:absolute;top:0;width:100%;max-width:100%;}img{width:100%;}.lds-roller{display:inline-block;position:relative;width:64px;height:64px;}.lds-roller div{animation:lds-roller 1.2s cubic-bezier(.5,0,.5,1) infinite;transform-origin:32px 32px}.lds-roller div:after{content:" ";display:block;position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;margin:-3px 0 0 -3px}.lds-roller div:nth-child(1){animation-delay:-36ms}.lds-roller div:nth-child(1):after{top:50px;left:50px}.lds-roller div:nth-child(2){animation-delay:-72ms}.lds-roller div:nth-child(2):after{top:54px;left:45px}.lds-roller div:nth-child(3){animation-delay:-108ms}.lds-roller div:nth-child(3):after{top:57px;left:39px}.lds-roller div:nth-child(4){animation-delay:-144ms}.lds-roller div:nth-child(4):after{top:58px;left:32px}.lds-roller div:nth-child(5){animation-delay:-.18s}.lds-roller div:nth-child(5):after{top:57px;left:25px}.lds-roller div:nth-child(6){animation-delay:-216ms}.lds-roller div:nth-child(6):after{top:54px;left:19px}.lds-roller div:nth-child(7){animation-delay:-252ms}.lds-roller div:nth-child(7):after{top:50px;left:14px}.lds-roller div:nth-child(8){animation-delay:-288ms}.lds-roller div:nth-child(8):after{top:45px;left:10px}@keyframes lds-roller{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}</style><div id="qm"><p onclick="window.opener.sendmsg();">Fullscreen...</p><div style="position:absolute;left:50%;margin-left:-32px;top:50%;margin-top:-32px;"><div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></body></html>');
                qm.close();
                quickMessage = qm.getElementById('qm');
                quickMessage.innerHTML = "<div style=''><input style='width:calc(70% - 12px);margin-left:12px;margin-top:25px' type='text' id='msg'><input style='width:calc(30% - 24px);margin-left:12px;padding:6px' onclick='window.opener.sendmsg()' type='submit' value='Send to screen ->'></div>";
                qmObj.addEventListener('keydown',function(event){
                    if(event.which == 13){
                        sendmsg();
                        qmObj.close();
                    }
                    if(event.which == 9){
                        qmObj.close();
                    }
                });
            }
            window.addEventListener('keydown',function(event){
                if(event.which == 81){
                    openQuickMessage();
                }
            });
            function slidehtml(a,c){return("<img src='slides/" + a + "43" + c + ".jpeg'>");}
            window.addEventListener('load',function(){
                createDisplay(true);
            });
        </script>
    </body>
</html>
0
Seth B 21 सितंबर 2019, 20:17

2 जवाब

सबसे बढ़िया उत्तर

मेरा मानना ​​​​है कि हर बार जब आप loadSong फ़ंक्शन को कॉल कर रहे हैं, key down ईवेंट संलग्न किया जा रहा है, जो पहले से ही सामान्य रूप से पिछले/पूर्व फ़ंक्शन कॉल से जुड़ा हुआ है, जो मैं आपको करने का सुझाव देता हूं समारोह के बाहर श्रोता को संलग्न करना है:

तो आप लोडसॉन्ग फ़ंक्शन होंगे:

function loadSong(a){
     var b = 1;
     console.log("Start: " + b);
     var html = slidehtml(a,b);
     if(vr_on){
     vr.innerHTML = html;
     }
     display.innerHTML = html;
}
1
P.hunter 21 सितंबर 2019, 21:07

आपके पास एक वैश्विक b है, क्योंकि आप इस चर को किसी फ़ंक्शन के अंदर परिभाषित नहीं करते हैं।

2
Nina Scholz 21 सितंबर 2019, 20:20