Gibt es eine Möglichkeit, den Standardwert der Bereichseingabe auf leer zu setzen?

Question

Ich habe eine Eingangs HTML5 Bereich

<input name="testing" type="range" min="0" max="10" step="1"> 

Wenn kein Attribut „value“ gesetzt ist, setzt sie den Standardwert in der Mitte (d.h. 5 in diesem Fall). Gibt es eine Möglichkeit, es leer zu machen, so dass ich weiß, ob der Benutzer etwas aktiv eingegeben hat?

Ich habe ein anderes div für die Wertanzeige. Am Anfang wird der Wert "?" Sein, so dass der Benutzer weiß, dass er nichts eingegeben hat. Das Problem besteht darin, zu verhindern, dass die Eingabe einen Wert an das Back-End sendet, wenn der Wert nicht aktiv gesetzt ist.

Answer 1

Leider ist dies eine Einspannung des [type=range] Elements:

Der Standardwert ist das Minimum plus der halben Differenz zwischen dem Minimum und dem Maximum, wenn nicht die maximalen weniger als das Minimum ist, in welchem ​​Fall des Standardwert ist das Minimum.

– HTML5 Specification

Wenn Sie keine andere Wahl haben, als dieses Element zu verwenden, würde ich vorschlagen einen zusätzlichen Wert zu Ihrem Bereich hinzufügen, dann für diesen Wert überprüft, wenn die Form der Validierung. I.e. Wenn Ihr aktueller Bereich zwischen 0 und 10 liegt, ändern Sie den Bereich zwischen -1 und 10, und geben Sie dann den Wert -1 an. Überprüfen Sie auf der Validierungsseite, ob der Wert nicht -1 entspricht.

Answer 2

Nach @James Donnelly Antwort

Ich denke, Ihre Lösung ist hier ein paar JS hinzuzufügen für Ihre eigene Check zu machen.

Ändern Sie einen booleschen Wert, wenn der Benutzer den Wert ändert und nach Änderungen fragt.

Hier eine Lösung, die Ihnen helfen kann.

var rangechanged=false; 
 

 
$("#submit").click(function(){checkRange()}); 
 

 
function checkRange() 
 
{ 
 
    console.log(rangechanged); 
 
    if(rangechanged==false) 
 
    alert("You must lock the range first"); 
 
    
 
    return rangechanged; 
 
} 
 

 
$("#lockrange").click(function(){ 
 
    rangechanged=true; 
 
    $("#lockrange").hide(); 
 
}); 
 

 
$("#range").change(function(){ 
 
    rangechanged=true; 
 
    $("#lockrange").hide(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form> 
 
<input name="testing" id="range" type="range" min="0" max="10" step="1"> 
 
<button type="button" id="lockrange">Lock range</button> 
 
<button type="button" id="submit">Submit</button> 
 
</form>

Answer 3

Was Sie tun müssen, ist, dass, nachdem Sie Ihre Eingabe Ranger erstellt haben, Verwendung jquery diese Bereiche zu 0 zu machen, und es wird funktionieren