时间戳

首页 > 解决方案 > 发送不带“？”的表格 字符和值的名称

html - 发送不带“？”的表格 字符和值的名称

问题描述

我有这个代码：

<!DOCTYPE html>
<html>
<head>
<title>Form</title>
</head>
<body>
    <form action="https://api.pagar.me/1/zipcodes/">
        <input type="text" placeholder="cep" name="cep">
        <input type="submit">
    </form>
</body>
</html>

当我输入一个数字时，例如 05423110，我在地址栏上看到的是“ https://api.pagar.me/1/zipcodes/?cep=05423110 ”，但我想要“ https://api .pagar.me/1/zipcodes/05423110 ”。

我需要对我的代码进行哪些更改？

谢谢！

标签： html

解决方案

我会这样做。另一个答案将有一个问题，它可能会附加两次。

我还将它设置为禁用按钮以方便用户使用（以防服务器需要一段时间才能响应）。

该解决方案确实使用了 jQuery，但您可能需要进行其他简单的 DOM 操作，这将非常有帮助。

因为您不希望查询字符串在那里，但您必须拥有它GET，所以不可能不将查询字符串附加到 URL（因为这是 GET 请求所做的）。

相反，我使用 javascript 来简单地重定向到正确的 URL，并完全忽略 GET/POST 表单。

<!DOCTYPE html>
<html>
<head>
<title>Form</title>
</head>
<body>
    <form action="https://api.pagar.me/1/zipcodes/">
        <input type="text" placeholder="cep" name="cep">
        <input type="submit">
    </form>
</body>
</html>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
  (function() {
    var form = $('form');
    var baseUrl = form.attr('action');

    $('form').submit(function(e) {
      e.preventDefault();
      form.find('[type="submit"]').prop('disabled', true);
      window.location.href = baseUrl + form.find('[name="cep"]').val();
    });
  })();
</script>

推荐阅读