首页 > 解决方案 > 用按钮连接 2 个表单域

问题描述

当用户按下按钮时,我试图连接 2 个字段的值。按下按钮后,它应该显示连接的字符串。似乎无法弄清楚,因为这是我第一次玩 html 表单。这是我的代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
</head>

<body>

<form method="GET">
<input type="text" name="num1" placeholder="Number 1">
<input type="text" name="num2" placeholder="Number 2">
<br>
<button type="submit" name="submit" value="submit">Generate</button>
</form>
<p>Response:</p>
<?php
if (isset($_GET["submit"])) {
$name = $_GET['num1'] . ' ' . $_GET['num2'];
echo $name;
}
?>



</body>


</html>

当我单击按钮时,似乎信息正在传递到 URL,因为这是输入“aaaa”和“bbbb”时显示的内容:

    file:///storage/emulated/0/web-files/index.php?num1=aaaa&num2=bbbb&submit=submit

标签: phpstringformspostget

解决方案


正如我所看到的所提供的 url,您直接从浏览器打开一个 php 文件。尝试安装 apache 服务器,然后将文件保存在根目录中。它肯定会奏效。如果您想继续使用 php,可以通过此链接https://howtoubuntu.org/how-to-install-lamp-on-ubuntu 或者如果您只想连接这些输入值,您可以使用 JavaScript 来执行工作和一个简单的 html 文件会有所帮助。

<!DOCTYPE html>
    <head>
        <meta charset="UTF-8">
        <title>Test</title>
        <script type="text/javascript">
            function concatme()
            {
                var num1 = document.getElementById("num1").value;
                var num2 = document.getElementById("num2").value;
                document.getElementById("response").innerText = num1 + ' ' +num2;
            }
        </script>
    </head>
    <body>

    <form method="GET">
        <input type="text" name="num1" id="num1" placeholder="Number 1">
        <input type="text" name="num2" id="num2" placeholder="Number 2">
    </form>
    <br>
    <button  value="submit" onclick="concatme()">Generate</button>
    <p id="response"></p>
    </body>
</html>

推荐阅读