您可以使用單個 HTML 文件制作表單嗎？

Question

我可以找到的所有制作下拉表單的示例都涉及擁有一個單獨的 PHP 文件。 我正在嘗試將一些代碼嵌入到 Weebly 頁面中，所以我不確定是否可以在服務器上保存一個單獨的 PHP 文件。 那么有可能完全避免使用 PHP 嗎？ 也許用 JavaScript 和 jQuery 做所有事情？ 或者將表單和 PHP 放在同一個 HTML 文件中？

更具體地說，我想要做的是制作一個頁面，其中有幾個下拉表單。 用戶選擇幾個選項，點擊提交，客戶端后端對輸入進行一些計算，並打印出結果。

我一直在嘗試按照本指南進行下拉： https : //www.w3schools.com/tags/tag_select.asp

我一直在關注以表單形式使用 PHP： https : //www.ntchosting.com/encyclopedia/scripting-and-programming/php/php-in/

根據該指導，我創建了此非工作代碼：

<!DOCTYPE html>
<?php
  $Level = $_POST["level"];
?>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <form action="<?php echo $PHP_SELF;?>" method="post">
      Choose a level: <select name="level" id="level">
        <option value="high">High</option>
        <option value="med">Medium</option>
        <option value="low">Low</option>
      </select>
    </form>
    <p>
    <?php
      echo "".$Level;
    ?>
    </p>
  </body>
</html>

我說它不起作用，因為當我單擊下拉列表中的任何內容時，什么也沒有發生。

更多信息來自評論中的交流：

啊，這真的不需要和服務器交互。 它最終將成為一種工具，以便客戶可以獲得自動生成的估計報價。 所以他們回答了一些問題（即選擇一些下拉列表並在字段中輸入一些數字）並單擊提交，然后網頁會吐出估算值。 沒有保存任何信息或類似的東西，所以在客戶端處理一切應該沒問題。 但是，根據您的描述，這聽起來好像不能用 PHP 來完成。 我認為 Weebly 不會讓我更改文件擴展名。

Answer 1

你當然可以。 您可以使用表單上的onSubmit屬性來運行一些 javascript（以及擴展名 jquery），而無需實際提交表單。 更具體地說，它看起來像這樣：

<form onSubmit="return yourJavascriptFunction()" method="post">

在您的腳本中，您可以使用document.getElementById(yourDropdownID)從表單的字段中獲取下拉值並執行任何必要的操作。 如果您不希望表單重定向，只需return false; 在你的功能上。 使用這種方法，你真的不需要表單，可以使用一些帶有 id 的<select>標簽，以及一個偽提交按鈕：

<button onclick="yourFunction()">Submit</button>

Answer 2

如果您想使用 php 執行此操作，您必須將擴展名更改為 php 並添加一個提交按鈕，否則您可以在沒有 php 的情況下輕松執行此操作，如下所示。

<form action="#" method="post">
      Choose a level: <select name="level" id="level" onChange="document.getElementById('selectedValue').innerHTML = this.value;">
        <option value="high">High</option>
        <option value="med">Medium</option>
        <option value="low">Low</option>
      </select>
    </form>
    <p> <span id="selectedValue"></span></p>

Answer 3

刪除 DOCTYPE html 並將文件的擴展名更改為 .php

您可以使用單個 HTML 文件制作表單嗎？

問題描述

3 個解決方案

解決方案1
1 已采納 2020-08-28 22:15:05

解決方案2
0 2020-08-28 22:17:03

解決方案3
-4 2020-08-28 21:57:32

您可以使用單個 HTML 文件制作表單嗎？

問題描述

3 個解決方案

解決方案1 1 已采納 2020-08-28 22:15:05

解決方案2 0 2020-08-28 22:17:03

解決方案3 -4 2020-08-28 21:57:32

解決方案1
1 已采納 2020-08-28 22:15:05

解決方案2
0 2020-08-28 22:17:03

解決方案3
-4 2020-08-28 21:57:32