How can I display the spinner controls (up/down arrows) in a number input for IE without using jQuery?
Question
I have a requirement to have 2 number inputs that show the spinner control (up down arrows that increment/decrease the input value).
<input type="number"/>
The problem is that IE does not have support to visibly show the spinner. There is a jQuery solution using jqSpinner, but I would like to stay clear of jQuery, as it does not play nicely in my angular app.
Does anyone have a solution for this, I can't find an answer for this anywhere. (I have looked at all the similar answers, no duplicate question discusses a non-jQuery solution)
2 answers
solution1
0 2017-06-16 04:58:35
By JavaScript to control, maybe this is what you want
var fontSize = document.getElementById('fontSize'); function updateSize() { testDrive.style.fontSize = fontSize.value + 'px'; } fontSize.addEventListener('change', updateSize, false); updateSize();
<style type="text/css"> .textbox0 { width: 3em; background: #f1f1f1; padding: .25em .5em; line-height: 1.5; height: 1.5em; } </style> Font Size: <input id="fontSize" type="number" class="textbox0 mbm" min="8" value="48" /> px
solution2
0 2017-06-16 05:14:39
browsers like IE (v9 and lower) do have problems with HTML5 tags and HTML5 input types. In order to get all your HTML5 tags working and input types like number, tel etc working, place the following code between the <head></head> tags:
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
This is conditional IE script for HTML5 Shiv/HTML5 shim (or shim: which in computing language means a workaround). It is commented. So it is checked if the browser being used is IE or not, that's the first statement in the above code. If it is, this workaround is run and helps you use your HTML5 specific input values and tags.
Cheers!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.