0 votes
in SoSci Survey (dt.) by s093808 (180 points)
edited by s093808

Hallo zusammen,

Ich habe mit dem folgenden code ein Video eingebunden, und es bei den Testpersonen bei denen Autoplay blockiert wird, mit der click funktion starten lassen. Ich hätte gerne, dass bei erneutem Click in das Video, die Testpersonen gleich auf die nächste Fragebogenseite gelangen (was mit diesem Code auch funktioniert).

    <video width="712" height="488"  controlsList="nodownload nofullscreen" id="stimulus" autoplay playsinline>
  <source src="Air_Wick.ogg" type="video/ogg" />
  <source src="Air_Wick.mp4" type="video/mp4" />
  <source src="Air_Wick.webm" type="video/webm" />
</video>

    <script type="text/javascript">
document.getElementById("stimulus").addEventListener("click", function() {
  document.getElementById("stimulus").play();
});
</script>

<script type="text/javascript">
document.getElementById("stimulus").addEventListener("click", function() {
  document.getElementById("stimulus").play();
});
</script>

Allerdings würde ich gerne die Click funktion auf das video zum weiterleiten auf die nächste Seite erst 5 Sekunden nachdem das Video spielt aktivieren. Ich habe es mit folgendem Code versucht, der leider nicht funktioniert:

<script type="text/javascript">
<!--

function click2()  {
 var video = document.getElementById("stimulus");
document.getElementById("stimulus").addEventListener("click", function() {
 SoSciTools.attachEvent(video, "click", SoSciTools.submitPage);
})

SoSciTools.attachEvent(video, "play",
  function() {
    var video = document.getElementById("stimulus");
     click2.style.display = "false";
    window.setTimeout(click2, 5000); // 
      });
</script>

Ich wäre super dankbar, wenn mir jemand den richtigen Code sagen könnte.

Vielen Dank im voraus und liebe Grüße
Sara

1 Answer

0 votes
by SoSci Survey (328k points)

Allerdings würde ich gerne die Click funktion auf das video zum weiterleiten auf die nächste Seite erst 5 Sekunden nachdem das Video spielt aktivieren.

Ihr Code startet beim Klick einen Timer und leitet dann nach 5 Sekunden auf die andere Seite weiter.

Wenn ich Sie korrekt verstehe, dann möchten Sie nach dem Klick eigentlich einen Filter, welcher den Klick ignoriert, wenn das Video noch nicht bei der 5-Sekunden-Position ist. So ähnlich wie die Werbeanzeigen bei YouTube ;)

Diesen Filter können Sie ganz einfach mit der Eigenschaft currentTime realisieren:

document.getElementById("stimulus").addEventListener("click", function() {
    if (document.getElementById("stimulus").currentTime >= 5) {
        SoSciTools.submitPage();
    }
}
by s093808 (180 points)
Genau wie die Werbeanzeigen auf YouTube :). Ich möchte, dass es erst 5 Sekunden nach Start des Videos möglich ist zu klicken und somit auf die nächste Fragebogenseite zu gelangen.

Leider habe ich nicht so genau verstanden an welcher Stelle meines Codes ich den o.g.nannte Code einsetzen muss, dass es funktioniert. So wie ich ihn eingesetzt habe funktioniert es leider nicht:

<script type="text/javascript">
<!--

function click2()  {
 var video = document.getElementById("stimulus");
document.getElementById("stimulus").addEventListener("click", function() {
 SoSciTools.attachEvent(video, "click", SoSciTools.submitPage);
})

SoSciTools.attachEvent(video, "play",
  function() {
   document.getElementById("stimulus").addEventListener("click", function() {
    if (document.getElementById("stimulus").currentTime >= 5) {
        SoSciTools.submitPage();
    }
}
</script>


Ganz lieben Dank!!
by SoSci Survey (328k points)
Im Prinzip können Sie den Code auf der obersten Ebene platzieren - denn solange das Video nicht läuft, ist der Klick ja auch wirkungslos.

Die Funktion click2() ist m.E. obsolet.

Prinzipiell sollte es aber so funktionieren, wie Sie oben schreiben. Ergänzen Sie noch ein wenig Debugging-Information und sehen Sie mal nach, was die JavaScript-Fehlerkonsole des Browser so sagt.

video.addEventListener("play", function() {
    console.log("play");
    document.getElementById("stimulus").addEventListener("click", function() {
        console.log("click");
        console.log(document.getElementById("stimulus").currentTime);
        if (document.getElementById("stimulus").currentTime >= 5) {
            SoSciTools.submitPage();
        }
    }
}
by s093808 (180 points)
Leider funktioniert dieser Code auch nicht. Man kann das Video zwar noch mit einem click in das Video starten, aber wird auch nach 5 Sekunden und dem click nicht weitergeleitet.

Die JavaScript-Fehlerkonsole sagt "SyntaxError: missing ) after argument list"
Ich habe allerdings nochmal alle ) gecheckt und soweit ich sehen kann keine vergessen.

Vielen vielen Dank für Ihre Hilfe (und Geduld!)
by s093808 (180 points)
Habe das Problem gefunden :)

video.addEventListener("play", function() {
    console.log("play");
    document.getElementById("stimulus").addEventListener("click", function() {
        console.log("click");
        console.log(document.getElementById("stimulus").currentTime);
        if (document.getElementById("stimulus").currentTime >= 5) {
            SoSciTools.submitPage();
        }
    }
)}
);

Willkommen im Online-Support von SoSci Survey.

Hier bekommen Sie schnelle und fundierte Antworten von anderen Projektleitern und direkt von SoSci Survey.

→ Eine Frage stellen


Welcome to the SoSci Survey online support.

Simply ask a question to quickly get answers from other professionals, and directly from SoSci Survey.

→ Ask a Question

...