Question

为了向不太了解PHP的人证明自己，我需要处理一些由人们设计和构建的笨拙的黑客攻击系统，这些人可能不应该再被允许编程。基本上，已经决定允许用户在实际完成注册之前上传他们的个人资料的图像。就在那里，在注册表单的中间，一个完全独立的表单（功能上，它必须看起来相同），文件上传字段，单独的提交按钮和图像显示区域。显然，客户看到AJAX图像在另一个网站上传，并决定，“这很酷，我们想要那个！”实际上并不知道表单是如何工作的或考虑到未注册用户为什么要上传内容

我最初的想法是在其他地方创建一个不可见的表单，并在单击按钮时复制文件框值，然后是AJAX提交。这不起作用，因为JavaScript无法编辑文件框的值。可以理解的。

第二次尝试是创建嵌套表单。使用some hacking，我确实设法让FireFox看到两个表单，但提交内部表单提交外部表单。 “未定义的行为”，我相信是这个词。有道理，你不应该嵌套表格。

所以 - 忽略这一事实，这完全没有意义，并且客户真的应该被告知 - 是否有任何方法可以在页面上创建文件上传表单，可以通过AJAX提交，并且是明显的位于另一种形式？我希望避免在页面的其他地方创建表单，并用可怕的CSS黑客攻击它。

Answer 1

我不知道这对你来说是否足够巧妙，但是如何在表单中间嵌入iframe并在该窗口中进行文件上传呢？它可能不是纯粹的邪恶，真的是那么聪明和狡猾，但它可能有用。

在提交父级时，我可以看到唯一的副作用，嵌入式iframe也是如此。如果你足够小心并确保在文件上传时没有使用iframe，我认为你应该没问题。

<强>父

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<form submit="http://www.google.com/search" method="get">
    <div>
        <input type="text" name="q" value="[ Search Google Here ]"/>
    </div>
    <iframe src="http://jfcoder.com/test/embed.php" style="width: 200px; height: 200px;"></iframe>
    <div>
        <button type="submit">Submit this Page's Form</button>
    </div>
</form>
</body>
</html>

<强>嵌入式

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<?php

if ($_GET['q']) {
    echo "<p><strong>GET SUBMITTED</strong></p>";
}

?>
<form submit="embed.php" method="get">
    <div>
        <input type="text" name="q" value="Type whatever"/>
        <button type="submit">Submit this Page's Form</button>
    </div>
</form>
</body>
</html>

http://jfcoder.com/test/parentform.php

Answer 2

编辑：

请阅读：nested html FORM is inaccessible - multiple forms problem

答案说表单元素不能包含其他表单元素，因此即使可能在浏览器上工作也不意味着您应该使用此技术。尝试将其全部放入一个表格中，如下所示：

<form action="register.php" method="POST" enctype="multipart/formdata">
 <input name="username" type="text" />
 <input name="password" type="password" />
 <input name="avitar" type="file" />
 <input name="image" type="submit" value="Upload" />
 <input name="register" type="submit" value="Register" />
</form>

或者更好的是，使用jQuery / AJAX上传avitar而不离开页面。

原始答案：

你可以使用一些javascript来解决这个问题。这是一个快速，未经考验的例子：

<head>
 <script>
  var submitted = false;

  function canSubmit() {
   if(submitted) return false;
   submitted = true;
   return true;
  }
 </script>
</head>
<body>
 <form action="register.php" method="POST" onsubmit="return canSubmit();">
  <input name="username" type="text" />
  <input name="password" type="password" />
  <form action="upload.php" method="POST" onsubmit="return canSubmit();" enctype="multipart/formdata">
   <input name="avatar" type="file" />
   <input type="submit" value="Upload" />
  </form>
  <input type="submit" value="Register" />
 </form>
</body>

另一种方法是只为表单提供相同的操作，并提供提交按钮名称，以便您可以分辨哪个提交。这仅在用户单击提交按钮时才有效，并且仅在选择其中一个文本框时才按Enter键，但对于文件上载表单，用户必须单击提交按钮。

HTML - 嵌套表单解决方案？

2 个答案:

编辑：

原始答案：