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 脚本。你的边框：无使输入的边框消失。我纠正了这一点。而且我假设你已经使用了一个 div 来在每个输入后面加上一个红色 * 来表示它是必填字段。

我做对了吗？

于 2012-06-01T12:43:43.750 回答