表单提交需要javascript和输入

时间:2014-01-13 01:41:12

标签: javascript html forms

我试图使用div,HTML5,JavaScript提交内容。如果我使用提交按钮验证器(输入中的必需属性)工作按钮不提交信息。但是,如果我使用div标签,它不会验证并发送信息。有什么办法解决吗?或者我应该使用整个代码来验证信息并停止提交吗?

http://www.dropmocks.com/mCyfGJ

我使用以下代码。 Javascript提交: http://www.javascript-coder.com/javascript-form/javascript-form-submit.phtml

HTML

在这里输入代码

<form action="index.php" method="get" name='myform'>
<ul>
<li class="row">
                            <label class="labels" for="username">Username</label>
                            <input type="text" id="txtUser" required>
                        </li>
                        <li class="row">
                            <label class="labels" for="password">Password</label>
                            <input type="password" id="txtPass" required>
                        </li>
                        <li id="row2">
                            <div class="button"><a href="javascript: submitform()">Submit</a></div>
                            <input type="submit">
                        </li>
                    </ul>
                </form>

1 个答案:

答案 0 :(得分:1)

如果您通过JS提交,那么您需要自己调用表单验证。我发布的帖子中没有任何问题会阻止提交(未经验证)。但这是一个有效的例子。请记住,并非所有浏览器都支持html5验证。

<!DOCTYPE html>
<html>
  <body>
    <form action="index.php" method="get" name='myform'>
      <ul>
        <li class="row">
          <label class="labels" for="username">Username</label>
          <input type="text" id="txtUser" name="sds" required>
        </li>
        <li class="row">
          <label class="labels" for="password">Password</label>
          <input type="password" id="txtPass" required>
        </li>
        <li id="row2">
          <div class="button"><a href="" onclick="return submitform()">Submit</a></div>
          <input type="submit">
      </li>
      </ul>
    </form>

    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

    <script>
    function submitform() {
      // Get first form element
      var $form = $('form')[0];

      // Check if valid using HTML5 checkValidity() builtin function
      if ($form.checkValidity()) {
        console.log('valid');
        $form.submit();
      } else {
        console.log('not valid');
      }
      return false;
    };
    </script>
  </body>
</html>