Heim  >  Artikel  >  Web-Frontend  >  Einfache Implementierung des JavaScript-Bildwechseleffekts

Einfache Implementierung des JavaScript-Bildwechseleffekts

高洛峰
高洛峰Original
2016-12-03 16:30:581699Durchsuche

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>

-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;
}

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>

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

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

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;
}

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

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


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn