Javascript gesetzt versteckten Feld Wert aus einem anderen Feld funktioniert nicht auf mobilen Geräten

Question

Ich habe ein verstecktes Feld, das den String-Wert von einem div bekommen soll und alles ist in Ordnung, wenn im Browser arbeiten, aber es funktioniert nicht, wenn ich es an Tablet oder Smartphone. Ich verstehe das nicht.

hier ist mein div und verstecktes Feld:

div id="signature-div" style="border: dotted 2px grey;"> 
    <div id="canvas"></div> 
</div> 

<input name="signature" type="hidden" id="signature" value=""> 

und die Funktion:

$(document).ready(function() { 

    // signature 
    var W = $("#signature-div").width(); 
    var sigCanvas = $("#canvas").jSignature({width: W, height: 180, "background-color":"#ddd"}); 

    // after signing the offer set hidden field value to signature 
    $(document).on('mouseup', '#canvas',function(){ 
    //$("form").submit(function() { 
     var rawSig = $("#canvas").jSignature("getData","svg"); 
     //$("#img").attr("data", 'data:' + rawSig); 

     //$("#signature").val('data:' + rawSig); 
     document.getElementById("signature").value = 'data:' + rawSig; 

     // i have tried both of these up and it doesn't set the hidden value on mobile devices...is there something i'm missing here? 

    }); 

}); 

Answer 1

Sie tun, um Ihre "String-Wert erhalten" auf mouseup ...

Tablets und Smartphones haben keine Maus.
Versuchen Sie, fügen Sie einfach den touchend Termin in Ihrem Skript ... So:

$(document).on('mouseup touchend', '#canvas',function(){ 

Überprüfen Sie auch für die anderen touch events.
;)

Answer 2

Geräte ohne Maus wird nie auch

Fügen Sie den 'touchend' Veranstaltung ein 'mouseup' Ereignis auslösen:

$(document).on('mouseup touchend', '#canvas',function(){ 
...