JS Form 验证并发送表单而不提交输入

Question

我尝试在没有输入的情况下发送我的表单[提交]，但它无法正常工作。

教程地址：Link

我用过 jquery 验证插件。

我把图像按钮而不是输入[提交]。它不工作。我想将我的图像分配给验证功能而不是发送功能。

一些建议？

这里是代码

表格

<form id="kullaniciKayit" action="" method="post" novalidate>

            <input type="hidden" name="islem" value="uyeKayit">
            <input type="hidden" name="fbId" value="<?php echo $fidd ?>">

                <ul>
                    <li><input type="textbox" class="selector" style="background:transparent;" name="objAd" value="<?=$adSoyad?>" disabled></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objEposta" value="<?=$eposta?>" disabled></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objDtarih" placeholder="Gün/Ay/Yıl" ></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objAdres"></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objTel"></li>
                </ul>


            <div class="form-gonder">
                <a class="formGonderBtn" href="" target="_parent"><img src="../img/post-btn.png"></a>
            </div>

        </form>

jquery

<script type="text/javascript" src="../js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui-1.10.3.js"></script> 
<script type="text/javascript" src="../js/jquery.validate.js"></script> 

验证码

 <script>

  // When the browser is ready...
  $(function() {

    // Setup form validation on the #register-form element
    $("#kullaniciKayit").validate({

        // Specify the validation rules
        rules: {
            objAdres: "required",
        },

        // Specify the validation error messages
        messages: {
            objAdres: "Lutfen Adres Giriniz",
        },

        submitHandler: function(form) {
            form.submit();
        }
    });


  });

  </script>

Answer 1

您可以通过两种方式实现它：

方法 1： 只需将您的 HTML 更改为：

    <form id="kullaniciKayit" action="" method="post" novalidate>

            <input type="hidden" name="islem" value="uyeKayit">
            <input type="hidden" name="fbId" value="<?php echo $fidd ?>">

                <ul>
                    <li><input type="textbox" class="selector" style="background:transparent;" name="objAd" value="<?=$adSoyad?>" disabled></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objEposta" value="<?=$eposta?>" disabled></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objDtarih" placeholder="Gün/Ay/Yıl" ></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objAdres"></li>
                    <li><input type="textbox" class="selector"  style="background:transparent;" name="objTel"></li>
<li><input type="image" src="../img/post-btn.png" name="submit" ></li>
                </ul>

<!-- no need for this
            <div class="form-gonder">
                <a class="formGonderBtn" href="" target="_parent"><img src="../img/post-btn.png"></a>
            </div>
-->

        </form>

方法二：用下面的代码替换这个html块：

    <div class="form-gonder">
         <a class="formGonderBtn" href="" target="_parent"><img src="../img/post-btn.png"></a>
     </div>

与：

 <div class="form-gonder">
     <a class="formGonderBtn" href="javascript:void(0);" target="_parent"><img id="submit" src="dd-exit.gif"></a>
  </div>

并将以下代码添加到文档准备就绪：

    $('#submit').click(function(){
      $("#register-form").valid();
  });

所以最终代码是：

    $(function() {

        // Setup form validation on the #register-form element
        $("#kullaniciKayit").validate({

            // Specify the validation rules
            rules: {
                objAdres: "required",
            },

            // Specify the validation error messages
            messages: {
                objAdres: "Lutfen Adres Giriniz",
            },

            submitHandler: function(form) {
                form.submit();
            }
        });

     $('#submit').click(function(){
              $("#register-form").valid();
     });
  });

如果需要任何帮助，请告诉我。

Answer 2

您已将表单设置为不验证。删除 novalidate 属性