如何在操作链接中嵌入表单数据？

问题描述

我定义了一个表格：

<form method="post">
  <label for="phone_or_uid">Enter a phone number or uid:</label>
  <input type="text" name="phone_or_uid" value=""></input>
  <input type="submit" name="" value="Submit"></input>
</form>

当前，提交此表单时，我可以处理数据并根据phone_or_uid的值向页面添加信息。但是，我想做的是将表单重定向到同一页面，但在末尾附加phone_or_uid的值。因此，如果初始页面为https://myhost.com/lookup，那么如果https://myhost.com/lookup/16175431234输入框的值为phone_or_uid，则提交表单会将用户带到16175431234。

本质上，我的表单应如下所示：

<form action={some code that puts the value of phone_or_uid here}>
  ...
</form>

这可能吗？如果是这样，我怎么能做到这一点？如果可能的话，我不想创建或重定向到任何其他文件。

解决方法

我会使用JavaScript。监听提交事件并重定向到自定义网址。

,

这只是一个非常普通的示例：

<form method="post" onsubmit="submitFunction()">
    <label for="phone_or_uid">Enter a phone number or uid:</label>
    <input type="text" name="phone_or_uid" id="phone_or_uid" value=""></input>
    <input type="submit" name="" value="Submit"></input>
</form>

<script> 
    submitFunction = (event) => {
        event.preventDefault();
        const phoneInfo = document.getElementById('phone_or_uid').value;
        fetch('http://myhost.com/lookup/' + phoneInfo,{
            method: 'post'
        })
        .then(response => {
            window.location.href = "http://myhost.com/lookup/' + phoneInfo";
        });
    }
</script>