时间戳

首页 > 解决方案 > 在输入字段上设置最大和最小限制？

javascript - 在输入字段上设置最大和最小限制？

问题描述

我遇到了这个问题，我有一个 vuetify 文本字段，我正在尝试对其设置最大和最小限制。现在设置 min=0 和 max=10 有效，但似乎您仍然可以粘贴超过 10 的值。

这是一个代码笔

<div id="app">
  <v-app id="inspire">
    <v-container>
      <v-layout row wrap>
        <v-text-field
         type="number"
         min=0
         max=10
         onkeyup="if(this.value > 10) this.value = 10;">    
        </v-text-field>
      </v-layout>
    </v-container>
  </v-app>
</div>

new Vue({
  el: '#app',
  data() {
    return {
    }
  }
 })

使用 onkeyup 有效，但您仍然可以粘贴大于 10 的值，如果单击外部，则会显示大于 10 的值。

标签： javascriptvuejs2vuetify.js

解决方案

使用 oninput 我不会硬编码这些值

oninput="if(Number(this.value) > Number(this.max)) this.value = this.max;"

推荐阅读