检查文本字段的脚本不适用于chrome

时间:2014-03-10 18:22:58

标签: javascript google-chrome

我有一个表单和java脚本,用于检查文本是否为空。问题是,代码适用于IE和Firefox但不适用于chrome。

<form action="editor.php?id=<?=$id_book?>" method="post" name="form1" onsubmit="return check_form(this)" >
  <script language="javascript">
    function check()
    {
      if ((document.all.title.value==""))
      { 
        alert("Отсутствует название книги!"); 
      }

      if ((document.all.price.value==""))
      {
        alert("Отсутствует цена книги!"); 
      }

      if ((document.all.descrip.value==""))
      { 
        alert("Отсутствует описание книги!"); 
      }
      else
      {
        document.all.form1.submit();
      }
    }
  </script>
  <div class="list-group"> 
    <div class="input-group input-group-lg">
      <span class="input-group-addon"><div class="inp_width">Название:</div></span>
      <input type="text" name="title" class="form-control" value="<?=$value['title']?>">
    </div><br />  

    <div class="input-group input-group-lg">
      <span class="input-group-addon"><div class="inp_width">Цена:</div></span>
      <input type="text" name="price" class="form-control" value="<?=$value['price']?>">
    </div><br />

    <div class="input-group input-group-lg">
      <span class="input-group-addon"><div class="inp_width">Описание</div></span>       
      <textarea type="text" name="descrip" class="myform-control"  rows="5"><?=$value['descrip']?></textarea>
    </div><br />

    <?php endforeach; ?> 
    <div class="col-md-12">
      <div class="col-md-2"><button type="button" value="Submit" class="btn btn-primary" onclick="check()">Редактировать</button>
   </form>
 </div>

任何想法?更多的问题是,如果我只有一个文件检查铬,脚本工作正常。仅当我需要检查多个字段时,“提交”按钮才起作用。

更新:对不起伙计......一切正常......复制粘贴会杀了我...类型按钮应该是“提交”而不是“按钮”...下次我应该更加小心应对代码:)

2 个答案:

答案 0 :(得分:0)

您的IF语句看起来不正确。只有最后一个IF语句才会停止提交,因为这是与“else”步骤相关联的唯一调用。对于javascript,请尝试以下格式:

if (condition1)
  {
   code to be executed if condition1 is true
  }
else if (condition2)
  {
  code to be executed if condition2 is true
  }
else
  {
  code to be executed if neither condition1 nor condition2 is true
  }

另外,如果你想检查多个值,并且如果任何值不存在,你应该尝试某种标志。例如:

If (document.all.title.value==""){
    message += "Title is missing";
}
If (document.all.price.value==""){
    message += "Price is missing";
}

If (message == ""){
     document.all.form1.submit();
}else{
    alert(message)
}

答案 1 :(得分:0)

除了标记错误(请参阅我的评论),document.all is IE/MSHTML-proprietary and now deprecated(由于某种原因,Mozilla几年前采用了它)。在standards-compliant

时,您的代码应如下所示
<form … onsubmit="return check_form(this)">
  <script type="text/javascript">
    function check_form (form)
    {
      var elements = form.elements;

      if (elements["title"].value == "")
      { 
        window.alert("Отсутствует название книги!"); 
        return false;
      }

      if (elements["price"].value == "")
      {
        window.alert("Отсутствует цена книги!"); 
        return false;
      }

      if (elements["descrip"].value == "")
      { 
        window.alert("Отсутствует описание книги!");
        return false;
      }
    }
  </script>
  …
  <button type="submit" value="Submit" class="btn btn-primary">Редактировать</button>
</form>

请注意,如果出现错误,函数将返回false,因为返回值被返回到onsubmit事件处理程序(我认为是意图;您调用的),因此阻止提交表单,但没有在那里定义check()函数。如果有多个错误,您不应该打扰多个alert()的用户,但最多收集一个alert()的错误消息。您可以使用Array string个值。

但是,鉴于新的Firefox版本阻止用户在显示alert()时看到文档,您应该避免alert()并在文档中显示错误消息。一种常见的方法是使用脚本化的CSS突出显示错误的字段,并在整个表单的框中或在违规控件旁边放置说明特定字段有什么问题的消息。另请考虑HTML5 form validation