最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Percent sign in form input - Stack Overflow

programmeradmin8浏览0评论

Need help to make "%" sign show up automatically to my input field when user type number

<input type="text" name="ownership" id="ownership" placeholder="2.00%">

like here: If user enter some number it will always add "%" sign in view. Probably should use some js, but I'm not familiar yet.

I have tried This way, but it works for every input

 <script type="text/javascript">
   $('input').change(function() {
        $(this).val(function(index, old) { return old.replace() + '%'; });
    });
</script>

Need help to make "%" sign show up automatically to my input field when user type number

<input type="text" name="ownership" id="ownership" placeholder="2.00%">

like here: If user enter some number it will always add "%" sign in view. Probably should use some js, but I'm not familiar yet.

I have tried This way, but it works for every input

 <script type="text/javascript">
   $('input').change(function() {
        $(this).val(function(index, old) { return old.replace() + '%'; });
    });
</script>
Share Improve this question edited Jun 12, 2018 at 22:03 Philipp Kishkovarov asked Jun 12, 2018 at 21:50 Philipp KishkovarovPhilipp Kishkovarov 2231 gold badge5 silver badges20 bronze badges 5
  • 1 What have you tried so far? This is not a code-writing service. – mhodges Commented Jun 12, 2018 at 21:53
  • does it have to be inside the input box? does it have to be at the end? does it have to only appear after the user starts typing? – user9487972 Commented Jun 12, 2018 at 21:53
  • 1 sorry, won't click a *.ru link with a code attached... – Jeff Commented Jun 12, 2018 at 21:53
  • 1 sorry, I forgot to add code:( First post updated – Philipp Kishkovarov Commented Jun 12, 2018 at 21:57
  • @jeff sorry man, I thought joxi is enough popular screenshot service to post it here as support thing. I uploaded image right here – Philipp Kishkovarov Commented Jun 12, 2018 at 22:04
Add a ment  | 

2 Answers 2

Reset to default 4

If you use Boostrap this should work :

<div class="input-group mb-3">
  <input type="text" class="form-control" aria-label="">
  <div class="input-group-append">
    <span class="input-group-text">%</span>
  </div>
</div>

https://jsfiddle/uv9s6q02/

Seeing the code would help, but you can test to see if the user has typed a number using regex.

input.addEventListener('keyup', () => {
  if (inputvalue.search(/\d/) > -1) { /* add % */ }
});
发布评论

评论列表(0)

  1. 暂无评论