主页 / 问题 / 1054553
Accepted
fermeg
Asked:2020-12-05 16:48:36 +0000 UTC2020-12-05 16:48:36 +0000 UTC

数据正确性的表单验证

  • 772

有一个表格

<?php

$code = 1234;

 ?>

<input type="text" placeholder="Введите код сообщения"  />
<input type="submit" name="submit" value="проверить"  />

请告诉我，如何做到这一点，当我输入 1234 时，我会收到一条消息，表明代码是正确的，如果不正确，那就是错误。

我发现的只是表单验证，无论是否输入表单。

我这样做

 <form>
    <input type="text" pattern="<?php echo $code ?>" />
    <button type="submit">Отправить</button>
  </form>

如何添加会出现在底部的东西，如果输入正确，则正确输入下面的铭文并在底部出现另一个输入，如果没有，则错误？

javascript

2 个回答

  1. Best Answer

    选项1

    如果你的代码是保密的（不然为什么要保存在服务器上的php中呢？），那么问题的解决方法应该如下：

    您创建一个单独的 php 文件（例如 code.php），您的代码将在其中存储并根据请求返回

    <?php
    $code = 1234;
    echo $code;
?>

    在表单中，添加 action 和 method 属性并使用 ajax（这样页面不会重新加载）向服务器发送请求，以比较您的代码和用户输入的代码。如果值不匹配，则显示错误消息。如果它们匹配，则写“成功”并打开隐藏的第二个输入

    <form action="code.php" method="POST">
  <input type="text" name="code" placeholder="Введите код сообщения"  />
  <input type="submit" name="submit" value="проверить"  />
  <p class="message"></p>
  <input type="text" name="newInput" hidden="" placeholder="Скрытый инпут" />
</form>

$(document).ready(function() {
    $('[type=submit]').click(function(e) {
      e.preventDefault();
        const form = $("form");
        $.ajax({
          cashe: false,
          type: form.attr('method'),
          url: form.attr('action'),
          data: form.serialize(),
          success: function(data) {
            if($('[name=code]').val() == data) {
                $('.message').text('Верно!').css('color','green');
                $('[name=newInput]').prop('hidden',false);
            }
            else {
                $('.message').text('Ошибка!').css('color','red');
            }
          }
        }); 
    });
});

    选项 2

    如果您的代码不是秘密的，那么根本没有必要打扰 php - 您可以检查用户直接在客户端上输入的内容并采取进一步的措施：

    $('[type=submit]').click(function(e){
  e.preventDefault();
  if($('[name=code]').val() == 1234) {
    $('.message').text('Верно!').css('color','green');
    $('[name=newInput]').prop('hidden',false);
  }
  else {
    $('.message').text('Ошибка!').css('color','red');
  }
})
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" method="">
  <input type="text" name="code" placeholder="Введите код сообщения"  />
  <input type="submit" name="submit" value="проверить"  />
  <p class="message"></p>
  <input type="text" name="newInput" hidden="" placeholder="Скрытый инпут" />
</form>

    • 1

  2. 相反'1234'，从 php.ini 粘贴您的变量。

    let code = 1234; // '<?php echo $code;?>'
let input = document.querySelector('input')

input.addEventListener('input', function() {
  input.value == code ? console.log('success') : console.log('error')
})
    <input type="text" />

    • 0

相关问题