<html lang="pt-pt" dir="ltr"><head></head><body>### [Como Limitar o Intervalo Permitido no Campo de Números](https://wpforms.com/developers/how-to-limit-range-allowed-in-numbers-field/)

**Publicado:** 27 de outubro de 2020
**Autor:** Umair Majeed

**Resumo:** Este tutorial mostrará como limitar o intervalo para um campo de Números. 

**Conteúdo:**

Gostaria de limitar o intervalo permitido no Campo de Números com o WPForms? Existem várias maneiras de definir valores mínimos e máximos para entrada numérica.

Este tutorial mostrará os métodos disponíveis para implementar limites de intervalo nos seus formulários.

## Configuração do Formulário

Vamos começar criando o nosso formulário e incorporando o campo **Números** nele. Se precisar de alguma orientação sobre como criar o seu formulário, [consulte esta documentação para obter instruções passo a passo](https://wpforms.com/docs/creating-first-form/ "Criando o Seu Primeiro Formulário").

![comece criando seu formulário e adicionando seus campos, incluindo pelo menos um campo de Números](https://wpforms.com/wp-content/uploads/2022/08/wpforms-create-form-limit-numbers.jpg)## Configuração de Limites de Intervalo Básicos

O campo Números inclui controles de intervalo no painel Opções do Campo. Simplesmente insira seus valores mínimo e máximo nos campos **Intervalo** para restringir a entrada do usuário.

![](https://wpforms.com/wp-content/uploads/2025/02/numbers-field-range-1-1024x430.png)Para mais detalhes sobre os recursos do campo Números, consulte nosso guia sobre [usando o campo Números](https://wpforms.com/docs/using-the-numbers-field).

## Implementando Controles de Intervalo Avançados

Para requisitos especializados, como impor números pares ou mensagens de validação personalizadas, você pode usar JavaScript para implementar controles de intervalo personalizados. Se precisar de orientação sobre como adicionar trechos de código, consulte este guia sobre [como adicionar código personalizado no WordPress](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/).

### Adicionando a classe CSS

Primeiro, vamos adicionar uma classe CSS ao campo para garantir que sempre que houver um campo **Números** com esta classe específica, este trecho será acionado. Para adicionar uma classe CSS a um campo, abra o construtor de formulários, clique em **Números** para abrir o painel **Opções do Campo**. Em seguida, clique em **Avançado** e, em **Classes CSS**, adicione `wpf-num-limit` .

![Adicionar a classe CSS limitará o intervalo permitido para o campo de número](https://wpforms.com/wp-content/uploads/2022/08/wpforms-add-the-css-class-limit-numbers.jpg)### Adicionando o Trecho de Código

Agora, vamos integrar o trecho.

Este trecho específico impõe um valor mínimo de **5** e um valor máximo de **20** para qualquer campo **Números** com uma classe CSS denominada `wpf-num-limit`.

```

/**
 * Limita o intervalo de números permitido para um campo de Números
 * Aplique a classe "wpf-num-limit" ao campo para ativar.
 *
 * @link https://wpforms.com/developers/how-to-limit-range-allowed-in-numbers-field/
 */
 
function wpf_dev_num_limit() {
    ?&gt;

**Categorias:** Campos

**Tags:** Javascript, JS

---</body></html>