Einfache Implementierung des JavaScript-Bildwechseleffekts-js-Tutorial-php.cn

Einfache Implementierung des JavaScript-Bildwechseleffekts

高洛峰

Freigeben： 2016-12-03 16:30:58

Original

1720 Leute haben es durchsucht

In diesem Artikel werden zwei Arten von Formularübermittlungsmethoden in JS anhand von Beispielen analysiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

1 Nachdem die ursprüngliche

<form method="post" action="/student/stureg/add" id="form1" onsubmit="return subForm();">
<button type="submit" class="button red" style="font-size:18px; font-family:&#39;微软雅黑&#39;;">提 交</button>

Nach dem Login kopieren

-Schaltfläche hier gesendet wurde, führen Sie die subForm()-Methode aus, subForm kann dies überprüfen form und geben Sie false zurück, das Formular wird nicht gesendet. Ansonsten absenden.

function subForm()
{
  var flag = true;
  $(".required").each(function(){
    if(!$(this).val())
    {
      flag = false;
      $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
      $(this).attr("status","1").val("此处为必填项,请您填写！");
    }
  });
 /*$(".idCardNo").each(function(){
  if(!idCardNo($(this).val()))
  {
   flag = false;
   $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
   if($(this).attr("status")!=1){
    $(this).attr("status","1").val("请填写正确的身份证号码！");
   }
  }
 });*/
 var reg = new RegExp("^[0-9]*$");
 $(".number").each(function(){
  if(!reg.test($(this).val()))
  {
   flag = false;
   $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
   if($(this).attr("status")!=1){
    $(this).attr("status","1").val("请填写正确的联系电话！");
   }
  }
 });
 $(".exCardNo").each(function(){
  if(exCardNo($(this).val())==1)
  {
   flag = false;
   $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
   if($(this).attr("status")!=1){
    $(this).attr("status","1").val("此身份证已报名！");
   }
  }
 });
  return flag;
}

Nach dem Login kopieren

Verschiedene Überprüfungen!

Senden von 2.js festgelegt

<form method="post" action="/student/stureg/reglogin" id="form_login">
<a id="submit"><img src="/images/login/login_bt.png" style="cursor:pointer"/></a>

Nach dem Login kopieren

Dies ist keine Senden-Schaltfläche, sondern eine simulierte Senden-Schaltfläche.

$("#submit").click(function(){
   if(loginForm())
   {
     $("#form_login").submit();
   }
});

Nach dem Login kopieren

löst das Übermittlungsereignis aus. Die Verwendung von

onsubmit="return loginForm();" hat keine Auswirkung, unabhängig davon, ob es false zurückgibt. Daher müssen Sie einige Überprüfungen durchführen, bevor Sie es tatsächlich einreichen.

function loginForm(){
 var flag = true;
 $(".notnull").each(function(){
  if(!$(this).val())
  {
   flag = false;
   $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
   $(this).attr("status","1").val("不能为空");
  }
 });
 return flag;
}

Nach dem Login kopieren

Gib false zurück und die Submit-Methode wird nicht aufgerufen.

Dies sind zwei Möglichkeiten, den Auftakt zur Formulareinreichung zu handhaben.