How to make javascript 'click' apply to mobile device? | XM Community
Skip to main content
Dear community,

We created a questionnaire that contains quite some slider scale questions. To prevent answer biases, most of these questions have added javescript to prevent the handle from being shown until after participants click the line. This works well and the survey indicates it is compatible on mobile devices. However, now that it's online we notice that these questions do not show the handle after participants tap the line (equivalent of clicking) on mobile devices. So it seems that the response is registered, but participants get no feedback and this is very confusing. Do you know a solution for this, to make the handle appear after the first tap on the bar on a mobile device? The added javascript is based on a previous answer from the community and looks as follows:



!



Or in text (for easy copying) :



Qualtrics.SurveyEngine.addOnload(function()

{

/*Place your JavaScript here to run when the page loads*/

var q = jQuery("#"+this.questionId);

q.find(".handle").css('visibility', 'hidden');

q.find(".track").on("click", function() {

jQuery(this).find(".handle").css('visibility', 'visible');

});



});



Thank you in advance for your help!
Hi @irisver



One quick try I would ask is instead of using .css can you use .hide and .show

....

q.find(".handle").hide();

q.find(".track").on("click", function() {

jQuery(this).find(".handle").show();

.....
Hi @Subu,

Thank you for your response.

Unfortunately, this does not solve the issue. With this code on a desktop, the handle just appears at the start position, not on the clicked position. On a mobile device, the handle still does not show.

Would you perhaps have any other suggestion?



Thanks for thinking along!
Hello @irisver ,



Here is the updated code:



var q = jQuery("#"+this.questionId);

q.find(".handle").css('visibility', 'hidden');

q.find(".track").on("click , touchstart", function() {

jQuery(this).find(".handle").css('visibility', 'visible');

});

Leave a Reply