Блог

Главная - Вопросы по программированию - Как изменить формат чисел в поле ввода Materilaize?

Как изменить формат чисел в поле ввода Materilaize?

#css #material-design

#css #материал-дизайн

Вопрос:

Я искал способ изменить формат входных чисел в Materialize CSS, но пока ничего не нашел. Есть ли способ изменить формат входных чисел? введите описание изображения здесь

 <div class="row" >
        <div class="input-field col offset-s4 s4">
          <input id="price" type="number" class="validate"  >
          <label for="price">Price</label>
        </div></div>
        <div class="row">
        <div class="input-field col offset-s4 s4 ">
          <input id="DownPay" type="number" class="validate" >
          <label for="DownPay">Down Payment</label>

Ответ №1:

Это невозможно сделать по type="number" причине

вам нужно type=text с некоторым JS

 document.getElementById('Price').addEventListener('input', event =>
  event.target.value = (parseInt(event.target.value.replace(/[^d] /gi, '')) || 0).toLocaleString('en-US')
);  
  <!-- Compiled and minified CSS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <!-- Compiled and minified JavaScript -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
            

<div class="input-wrap">
<div class="input-field col s6">
          <input id="Price" type="text" id="" pattern="^[d,] $" class="validate">
          <label for="Price">Price</label>
        </div>
 
</div>

Комментарии:

1. Это не работает, я использую materializecss.com будет ли ваш код работать с ним?

2. Его работа для всех библиотек, которые вы используете, я обновил свой ответ с помощью materializecss

3. У меня все еще проблема, хотя я внес изменения, которые вы указали, можете ли вы проверить, правильно ли я выполнил свою работу? вот моя ссылка script.google.com/d /…

4. @MuhammedAadhil просто создайте рабочий пример вашего кода, как я сделал выше в моем фрагменте.

5. Я сделал именно так, как вы указали, но я понятия не имею, где я ошибся: (