Javascript以html表单中断文件上传

Question

我有一个文件上传表单，可以检查上传文件的扩展名，它可以正常工作，直到我添加一个显示“正在加载....”消息的 javascript，这总是会出现错误扩展名的错误，即使它是一个允许的。

表单.html

<form id="loader" action="uploadfile.php" method="post" enctype="multipart/form-data" onsubmit="return loading();" />

<label>Upload file:</label>

<input type="file" name="file" id="file" />

<input name="upload" type="submit" />

<input name="action" type="hidden" value="upload" />

</form>

<script>

  function loading() {

    document.getElementById("loader").innerHTML = "<div style='color: red;'>LOADING....</div>";

  }

</script>

上传文件.php

<?php

$allowedExts = array("txt", "TXT");

$temp = explode(".", $_FILES["file"]["name"]);

$extension = end($temp);

if (in_array($extension, $allowedExts))

  {

  if ($_FILES["file"]["error"] > 0)

    {echo $_FILES["file"]["error"]; }

  else

      {

      move_uploaded_file($_FILES["file"]["tmp_name"],

      "upfiles/thefile.txt");

?>

Answer 1

我可以实现预期的行为，我只是将元素id从form元素移到a div，然后就做到了，这是新代码：<form action="uploadfile.php" method="post" enctype="multipart/form-data" onsubmit="return loading();" /><label>Upload file:</label><input type="file" name="file" id="file" /><input name="upload" type="submit" /><input name="action" type="hidden" value="upload" /><div id="loader"></div></form><script>&nbsp; function loading() {&nbsp; &nbsp; document.getElementById("loader").innerHTML = "<div style='color: red;'>LOADING....</div>";&nbsp; }</script>