-1

我有一个用户名表格。其中有2个字段，用户名和密码。基本上我想要它，所以如果用户没有输入字段并按下“提交”，则会显示错误，如“请输入必填字段”

我知道使用 JavaScript 或 PHP 是可能的，但不确定如何去做。

这是用户和密码表单的代码：

<div id="sessionContainer" class="clearfix">
  <div class="content">
    <form action="goto.php" class=" sign-in" method="post">
      <div style="margin:0;padding:0"></div>
      <h3>Enter Details</h3>
      <p><font size="-1">Please enter your details</font></p><br>
      <div class="clearfix">
        <label for="">Username or email address</label><br>
        <input class="xlarge" id="email" name="email" tabindex="1" type="text" value="" />
      </div>
      <div class="clearfix">
        <label for=""><br>
          Password</label><br>
        <input class="xlarge" id="password" name="password" tabindex="2" type="password" value="" />
      </div>


      <p class="remember">&nbsp;</p>
      <p class="remember">
        <button class="btn btn-m btn-blue" id="signin_submit" name="commit" type="submit" tabindex=5>Sign in</button>
      </p>

谢谢

4

6 回答 6

2 
<?php if(!isset($_POST['email']) || !isset($_POST['password'])

此代码将检查这些字段中的任何一个是否有值。如果没有，您可以输出错误消息。整个上下文中的代码如下：

<?php if(!isset($_POST['email']) || !isset($_POST['password']): ?>
    <div>Please fill in all fields!</div>
<?php endif; ?>
于 2013-03-13T17:57:32.290 回答
1

这是我的答案...在经典的 javascript xD 中：

<html>
  <head>
  <script type="text/javascript">
  function validar()
  {
     var right = 1;

     if(document.getElementById('email').value.length==0)
     {
        right = 0;
        document.getElementById('emptymail').innerHTML = "Empty Mail o Username";
     }
     if(document.getElementById('password').value.length==0)
     {
        right = 0;
        document.getElementById('emptypass').innerHTML = "Empty Password";
     }

    if(right == 1)
    {
      document.forms["formu"].submit();
    }

  }
  </script>
  </head>
  <body>
  <form action="goto.php" class=" sign-in" method="post" name="formu" id="formu">
        <div style="margin:0;padding:0"></div>
        <h3>Enter Details</h3>
        <p><font size="-1">Please enter your details</font></p><br>
        <div class="clearfix">
          <label for="">Username or email address</label><br>
          <input class="xlarge" id="email" name="email" tabindex="1" type="text" value="" /><div id="emptymail"></div>
        </div>
        <div class="clearfix">
          <label for=""><br>
            Password</label><br>
          <input class="xlarge" id="password" name="password" tabindex="2" type="password" value="" /><div id="emptypass"></div>
        </div>


        <p class="remember">&nbsp;</p>
        <p class="remember">
          <button class="btn btn-m btn-blue" id="signin_submit" name="commit" type="button" tabindex=5 onclick="validar();">Sign in</button>
        </p>

  </form>
  </body>
  </html>

萨卢多斯 ;)

于 2013-03-13T18:12:06.850 回答
0

required使用该属性的仅 HTML 解决方案（仅适用于较新的浏览器）：

<input required="required" />

一个如何做一个基于 jscript 的解决方案的例子可以在这里找到，这里或者这个带有一点 jquery 帮助的。

于 2013-03-13T17:58:46.470 回答
0

使用jQuery Validate进行验证

从这里下载并调用它。然后添加此代码

rules:
{
    email:
    {
        required: true
    }

},
messages:
{
    email:
    {
        required: "Please enter your email."
    }
}

或者只是使用 HTML 5 验证

<input id="email" name="email"  type="text" value="" required />
于 2013-03-13T18:00:10.673 回答
0

要使用 JavaScript 执行此操作，您正在寻找表单的 OnSubmit 属性

如果您使用 OnSubmit 调用的函数失败（返回 false），您可以做很多事情，但作为示例，此代码将显示一个弹出框

<script>
function checkForm()
{
  if (document.getElementById('email').value.length==0 || document.getElementById('password').value.length==0)
  (
    alert("fill in required fields")
    return false;
  )
  return true;
}
<script>

然后在您放置的表单标签中

<form onsubmit="return checkForm()" ...
于 2013-03-13T18:03:17.343 回答
0 
var $form = $('form'),
    $user = $('#email),
    $pass = $('#password');

$form.on('submit', function(e) {
    e.preventDefault();   // stop the default behavior
    if ($user.text().length === 0) {
        $user.addClass('error'); // do something with the error class or add attribute 'required'
    } else if ($pass.text().length === 0) {
        // do something else
    } else if ($user.text().length > 0 && $pass.text().length > 0) {
          // post the form
          $.ajax({
              url: //URL where you send,
              data: $form.serialize(),
              success: function(e) { // do something },
              error: function(e) { // do something }
        });
    }
}
于 2013-03-13T18:09:16.993 回答