0

私は会社のウェブサイトを開発していますが、会社はユーザーが最初にすべての情報を入力し、次に続行することを望んでいます...

そのために、私はこのコードでフォームを作成しました:

    <form action="Owners Infoback.php"  onsubmit="return validateForm()"  method="post" name="enquiry" id="" class="form-body-02">
    <ul>
        <li style="overflow:hidden;">
          <label for="Name" class="l1">1. Name of owner:<br />
         <p>(If more than one seperate using comma.</br> Eg. A,B,C )<br /></p></label>
         <div id="nameOfOwnerError" style="visibility:hidden;color:red; display:inline; margin-left:20px;">*</div>
         <input name="Name_of_owner" type="text" class="textarea-bk-02" id=""  value="<?php echo "{$row[0]}";?>" style="border:none; width:330px; margin-left:14px; margin-top:15px; height:20px;"/>

        </li>

        <li>
          <label for="Name" class="l1">2. Name of company:<br /><p>(Enter name registered)</p></label>
          <div id="nameOfOwnerCompany" style="visibility:hidden;color:red; display:inline; margin-left:20px;">*</div>
          <input name="Name_of_company_registered" type="text" class="textarea-bk-02" id=""  value="<?php echo "{$row[1]}";?>" style="border:none; width:330px; margin-left:10px; margin-top:13px; height:20px;"/>
        </li>

        <li>
          <label for="Name" class="l1">3. Address:<p>(Write your own manufacturer address)</p></label>
          <div id="nameOfOwnerAddress"style="visibility:hidden;color:red; display:inline; margin-left:20px;">*</div>
          <input name="Owner_address" type="text" class="textarea-bk-02" id=""  value="<?php echo "{$row[2]}";?>" style="border:none; width:330px; height:20px; margin-left:13px; margin-top:13px;"/>
        </li>

        <li>
          <label for="Name" class="l1">4. Email id:<p></p></label>
          <div id="nameOfOwnerEmail" style="visibility:hidden;color:red; display:inline; margin-left:20px;">*</div>
          <input name="Owner_Email_id" type="text" class="textarea-bk-02" id=""  value="<?php echo "{$row[3]}";?>" style="border:none; width:330px; margin-left:13px; margin-top:13px; height:20px;"/>
        </li>


        <li>
        <div id="nameOfOwnerError1" style="visibility:hidden;color:red; display:inline; position:relative"> Name of owner,</div>
        <div id="nameOfOwnerCompany1" style="visibility:hidden;color:red; display:inline; position:relative"> Name of company,</div>
        <div id="nameOfOwnerAddress1" style="visibility:hidden;color:red; display:inline; position:relative"> Address,</div>
        <div id="nameOfOwnerEmail1" style="visibility:hidden;color:red; display:inline; position:relative"> valid Email id</div>
        <input name="Save" type="submit"  class="send-btns-02 right" value="save" style="margin-top:5px;" >
            <div class="clear"></div>
        </li>
    </ul>
  </form>

そしてヘッダー部分で、私はjavascriptを次のように書きました:-

     <script>
     function validateForm()
{
var y=true;
var x=document.forms["enquiry"]["Name_of_owner"].value;
if (x==null || x=="")
  {
    document.getElementById("nameOfOwnerError").style.visibility="visible";  
    document.getElementById("nameOfOwnerError1").style.visibility="visible"; 
    y= false;
  }
  else
  { document.getElementById("nameOfOwnerError").style.visibility="hidden";
    document.getElementById("nameOfOwnerError1").style.visibility="hidden";
  }

  x=document.forms["enquiry"]["Name_of_company_registered"].value;
if (x==null || x=="")
  {
      document.getElementById("nameOfOwnerCompany").style.visibility="visible";
      document.getElementById("nameOfOwnerCompany1").style.visibility="visible";
      y= false;
  }
  else
  {document.getElementById("nameOfOwnerCompany").style.visibility="hidden";
   document.getElementById("nameOfOwnerCompany1").style.visibility="hidden";
  }

 x=document.forms["enquiry"]["Owner_address"].value;
if (x==null || x=="")
  {
     document.getElementById("nameOfOwnerAddress").style.visibility="visible";
     document.getElementById("nameOfOwnerAddress1").style.visibility="visible";
    y= false;
  }
   else
  {document.getElementById("nameOfOwnerAddress").style.visibility="hidden";
    document.getElementById("nameOfOwnerAddress1").style.visibility="hidden";
  }

 x=document.forms["enquiry"]["Owner_Email_id"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  document.getElementById("nameOfOwnerEmail").style.visibility="visible";
  document.getElementById("nameOfOwnerEmail1").style.visibility="visible";
  y= false;
  }
  else
  {document.getElementById("nameOfOwnerEmail").style.visibility="hidden";
    document.getElementById("nameOfOwnerEmail1").style.visibility="hidden";
  }
  return y;
}
</script>

代替フィールドが入力されたときにスクリプトを実行した後、画面が表示されます(画像で確認できます)...連続した赤いテキストは印刷されず、非表示のフィールドのスペースも印刷されます...どうすればよいですか?空のフィールドの連続テキストを取得しますか?

私は新しいユーザーなので画像が表示されないので申し訳ありませんが、画像には所有者の名前と住所のみを入力すると表示されます。会社名と有効なメールIDを赤で印刷しますが、その真ん中に隠しアドレステキストの空きスペースがあります。どうすればそれを削除できますか?

4

2 に答える 2

2

使用する代わりに

.style.visibility="visible"; 

使用する

.style.display = ''; 

とのために

.style.visibility="hidden"; 

使用する

.style.display = 'none'; 
于 2012-06-01T12:27:19.310 に答える
0

これがあなたのためのjsfiddleです。 http://jsfiddle.net/rakesh_katti/cLjAN/

それが望ましい出力であるかどうかを確認してください。

各入力タグのvalue属性内にphpスクリプトを誤って配置しました。そして、border:noneを使用すると、入力の境界線が消えます。私はそれを修正しました。そして、uがdivを使用して、すべての入力の後ろに赤い*を付けて、それが必須フィールドであることを示していると思います。

私はそれを正しく理解しましたか?

于 2012-06-01T12:43:43.750 に答える