Question

我有一个包含姓名和电子邮件字段的基本新闻信函表格。我想在用户提交表单后隐藏表单。只有在验证通过且没有任何错误时才应隐藏它。这是我的代码

HTML

<div class="form-row">
    <div class="col-lg-12">
   <input type="text"  name="name" id="name"  value="" class="form-control" placeholder="Your Name">
    </div>
    <div style="clear:both;"></div>
    <div class="col-lg-12">
   <input type="text"  id="email" name="email" value="" class="form-control"  placeholder="Your Email">
    </div>
    <div style="clear:both;"></div>
    <div class="col-lg-12">
   <input type="submit" id="submit" name="submit" value="Sign up" class="btn-primary">
    </div>
  </div>

验证

<script language="Javascript" type="text/javascript">
<!--
/* wording of your error and thank you messages */
var error_1="Please enter your valid email address";
var error_2="Please enter your name";
var thankyou="Thank you. We'll keep you interested.";
function trim(str){str = str.replace(/^\s*$/, '');return str;}
function $Npro(field){var element =  document.getElementById(field);return element;return false;}
function emailvalidation(field, errorMessage) {
    var goodEmail = field.value.match(/[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?\.)+[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?/); 
    apos=field.value.indexOf("@");dotpos=field.value.lastIndexOf(".");lastpos=field.value.length-1;tldLen = lastpos-dotpos;dmLen=dotpos-apos-1;var badEmail= (tldLen<2 || dmLen<2 || apos<1);
    if (!goodEmail || badEmail) {$Npro("Error").innerHTML=errorMessage;$Npro("Error").style.display="inline";field.focus();field.select();return false;}
    else {return true;}
}
function emptyvalidation(entered, errorMessage) {
    $Npro("Error").innerHTML="";
    with (entered) {
    if (trim(value)==null || trim(value)=="") {/*alert(errorMessage);*/$Npro("Error").innerHTML=errorMessage;$Npro("Error").style.display="inline";return false;}
    else {return true;}}//with
}//emptyvalidation

function signup(thisform) {
    with (thisform) {
        if (emailvalidation(email,error_1)==false) {email.focus(); return false;};
        if (emptyvalidation(name,error_2)==false) {name.focus(); return false;};
    }
    $("#submit, #myResponse").hide();   // Hide the buttom and the message
    $("#loading").show();               // show the loading image.
    params=$("#subform").serialize();
    $.post("optIn.php", params, function(response ){
        //alert(response); //may need to activate this line for debugging.
        $("#loading").hide();
        $("#myResponse").html(thankyou); //Writes the "Thank you" message that comes from optIn.php and styles it.
        $('#myResponse').css({display:'inline',color:'green'})
        $("#submit").show();
        }
    )
return false;
}
//-->
</script>

请帮忙，因为我对此知之甚少。

Answer 1

在表单中添加一个类，例如login-form

<div class="form-row login-form">

并将其隐藏在下面

$.post("optIn.php", params, function(response ){
        //alert(response); //may need to activate this line for debugging.
        $("#loading").hide();
        $("#myResponse").html(thankyou); 
        $('#myResponse').css({display:'inline',color:'green'})
        $(".login-form").hide(); // hide the form
        }
    )

提交后隐藏新闻信函表格

1 个答案: