html - Is there a way to ONLY allow input using the spinner controls on an input type="number"? -


I want the user to be able to change the contents of the box with only in HTML5 Spinner available with input type = "number" , and not able to type anything in the box

     

Can I do this?

(My intent viewers are using Chrome only, so spinners are not visible on IE (9) and Firefox (13))

< Div class = "post-text" itemprop = "text">

You can use the javascript onkeydown event ... which will prevent the user from typing anything, and still He will be able to use the arrow controls to increase and decrease the numbers.

  & lt; Input type = "number" min = "0" value = "0" phase = "5" onkeydown = "return false" /> Note: Just do not depend on Javascript and HTML, it is always to ensure that the server side does not authenticate that the user does. Posted to a malicious input Javascript can be disabled and user can abuse by adding any text in the text box, but there is no other way you can prevent it, so check the server side too.  

As you commented, you would like to disable text selection, so that users are not confused, you can also use CSS positioning techniques here as you said that the desired user only Chrome does not have a lot of problems, so you can do something like this ...

Input element span element, and just css positioning technique and after: pseudo With, we overlay a virtual element on input .

Now I've put out the settings for demonstration purposes only, you can safely remove them.

  Duration {status: relative; Profile: 1px solid # 00f; } Duration: {content: ""; Width: 100%; Height: 100%; Left: 0; Top: 0; Status: Completed; Profile: 1px solid red; Width: 91%; }    

Comments

Popular posts from this blog

Java - Error: no suitable method found for add(int, java.lang.String) -

java - JPA TypedQuery: Parameter value element did not match expected type -

c++ - static template member variable has internal linkage but is not defined -