JavaScript during Loop & Merge | XM Community
Skip to main content

I'm trying to let a set of videos play during loop & merge and automatically continue to the next loop after a set amount of time. Unfortunately, YouTube blocks autoplay on smartphones so I had to use this script: https://stackoverflow.com/questions/15090782/youtube-autoplay-not-working-on-mobile-devices-with-embedded-html5-player.
I inserted this into my question text and changed the video ID to the piped text for the loop & merge field. The script plays well in the first loop but not in the subsequent ones. Could someone please tell me how I can execute that script in every loop? I'm new to both JavaScript and Qualtrics, so help would be very appreciated.

This is my JavaScript:
Qualtrics.SurveyEngine.addOnload(function()
{
setTimeout(function(){jQuery('#NextButton').click()}, "${lm://Field/2}"); 
});

Here's my question text:


   
       
   
 




 

What are you trying to achieve? Do you just want a video to play at the top while the person answers the questions I've after the other or is there something else?


I want to let my participants watch random videos from a set of 50 for 5 minutes, questions come in a different block after that time. The experience should mimick TikTok/YouTube Shorts, so the videos should play automatically. The participants can swipe to the next video, but if they don't swipe, the loop automatically shows the next video after the current one has been watched completely. I did not include the code for the timer and swiping as they are independent from the player code, but I can still post them if it helps.


Okay. In that case I wouldn't recommend using videos coming from YouTube. I am assuming they are going to be short videos, so upload them to your library and use the html video element which has an autoplay attribute, so that you don't need any JS.
To cache the video and ensure that there's no delay in loading the videos, add them to a hidden question earlier in the survey. However do not hide them using display:none, as some browsers do not load videos that aren't being shows, instead use the opacity attribute.


Another option would be to use the Matrix Carousel question. I feel that would be closer to YT Shorts/TikTock than L&M.


Leave a Reply