Question

我正在尝试在表单的动作属性中指定动态网址。网址将取决于用户在文本框中输入的内容。例如，如果用户输入"Fred"作为firstname，而1234输入courseId，则URL应该是"/users/Fred/course/1234"

这是我到目前为止所拥有的，但是它没有读取名字和courseId。

    <form action="/users/{{firstname}}/course/{{courseId}}" method="POST">
        <input type="text" placeholder="firstname" name="firstname">
        <input type="email" placeholder="email" name="email">
        <input type="text" placeholder="courseId" name="courseId">
        <input type="submit" value="Submit">
    </form>

不能使用php和ajax。

Answer 1

您需要使用javascript

const template = (firstname, courseId) => `/users/${firstname}/course/${courseId}`;

document.getElementById('myForm').addEventListener('submit', function(s) {
  s.preventDefault();
  this.action = template(this.elements["firstname"].value, this.elements["courseId"].value);
  this.submit();
});

<form action="placeholder" method="POST" id="myForm">
  <input type="text" placeholder="firstname" name="firstname">
  <input type="email" placeholder="email" name="email">
  <input type="text" placeholder="courseId" name="courseId">
  <input type="submit" value="Submit">
</form>

在表单操作中指定动态网址

1 个答案: