表单操作中的相对 URL 路径不起作用

Question

我正在制作一个表单，但单击该表单的提交按钮不会将我带到正确的路径。

<form action="delete" method="post">
    <button type="button">Cancel</button>
    <button type="submit">Delete</button>
</form>

它应该带我去

http://localhost:5000/<id>/delete

（代替 的是用户 ID）

但这需要我

http://localhost:5000/delete

并且

http://localhost:5000/<id>/delete

是网页而不是文件。这意味着该网站不是静态的，而是动态的。

我在这里做错了什么？

Answer 1

注意：假设您的

delete

是一个文件，并且它与您当前的html文件位于同一目录（

id/

）中。

关于路径的一点事情：

• pathname

  是绝对的。这意味着它将在根目录中搜索路径名。 （在本例中是您的网络应用程序的根文件夹）

• ./pathname

  是相对的。

  .

  表示当前目录（也称为您的文件（例如

  index.html

  ）所在的目录）。

• ../pathname

  也是相对的。

  ..

  表示您所在的当前文件夹之上的一个文件夹。

示例：

rootFolder/
  test.html
  anotherFolder/
    otherFile.html
  folder/
    index.html
    delete.html

现在假设您在

folder/

• test.html

  -> 有效

• ./test.html

  -> 自

  .

  ==

  rootFolder/folder/

以来不存在

• ../anotherFolder/otherFile.html

  -> 有效，因为

  ..

  向上移动一个文件夹（从

  folder/

  到

  rootFolder

  ），然后输入

  anotherFolder/otherFile.html

当您打开终端并

cd

（更改目录）时，完全相同的原则也适用。您可以先尝试该路径是否有效。

要回答你的问题，应该是：

action="./delete"

你现在正在使用绝对路径。

Answer 2

您应该尝试从 URL 中提取 ID，然后将该 ID 设置到您的表单操作中，例如：

按照此 stackoverflow 问题从 url 中提取 ID 如何在 JavaScript 中获取查询字符串值？

<form action="/<id>/delete" method="post">
    <button type="button">Cancel</button>
    <button type="submit">Delete</button>
</form>

Answer 3

@Tuilip 经历的行为是因为表单操作属性中的相对路径。实际操作中的相对路径将始终替换 url 中最后一个斜杠之后的任何内容。

示例： 网址为“/items/123” 表单操作是“删除” 结果将是“项目/删除”

如果网址是“/items/123/” 结果将是“items/123/delete”