如何去除？（问号）来自 url 当它后面没有任何参数时？答案

【问题标题】：How to remove ? (question mark) from url when it is not followed by any parameters?如何去除？（问号）来自 url 当它后面没有任何参数时？
【发布时间】：2019-11-10 01:15:18
【问题描述】：

我有一个向服务器发送获取请求的表单。输入参数以 QueryString 形式发送到服务器。

这是我的表格：

<form action="host-name/Home/Browse"  onsubmit="removeEmptyParameters()">
    <input type="text" name="Term" /> 
    <input type="text" name="Address" /> 
    <input type="submit" value="submit">
</form>

在提交表单之前，执行以下 JavaScript 方法以从表单中删除空输入参数：

function removeEmptyParameters() {
    // set the name attribute = "" for empty inputs, so they won't be posted to server
    $('form').find('input').each(function () {
        if (this.value === "") {
            $(this).attr('name', '');
        }
    });
}

因此，如果用户输入一些输入，请求将是：

ulr: host-name/Home/Browse?Term=some-term&Address=some-address

如果所有输入为空，则将以下 url 发送到服务器：

ulr：主机名/主页/浏览？

这很好用，但我想从 url 中删除 ?，这样它就干净了。可以这样做吗？

【问题讨论】：

标签： javascript jquery asp.net-mvc url query-string

【解决方案1】：

您可以使用 String.prototype.slice() 方法来实现这一点。如果您的网址的最后一个字符是“？”，您可以将其从网址字符串中删除。

let url = "www.someurl.com?";
let length = url.length;
if(url.charAt(length-1)==='?')
url=url.slice(0,length-1);
console.log(url);

有关 slice() 的更多详细信息，请访问以下 MDN 链接： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice

我不确定这是否是最佳解决方案，但您可以尝试使用 window.location.href 来重定向以防参数为空。这样，就可以保持 url 干净。

【讨论】：

谢谢，但是如何获取网址？？
我不确定这是否是最好的解决方案，但您可以尝试使用 window.location.href 来重定向以防参数为空。这样，就可以保持 url 干净。
感谢您的建议，我最终按照您的建议执行并重定向到新位置，而不是提交表单。如果您在答案中包含您的建议，我会将其标记为已接受的答案。
@HoomanBahreini 我很高兴为您解决了问题！我已将其包含在我的答案中。

【解决方案2】：

你可以像这样重写你的代码。

使用这种方法，您的浏览器 URL 不会根据表单值动态更改，并且您的 URL 看起来很干净。

您还可以利用 jquery 库（因为您的代码已经使用 jquery 编写）来使用 ajax 提交表单，您可以在其中根据输入数据动态修改表单 URL。这样你就有更多的控制权。

<html>

<head>
  <script src="https://code.jquery.com/jquery-3.4.1.min.js"
    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous">
    </script>

  <head>

  <body>
    <!-- Replace with your hostname instead of https://eniuu7vo8sak.x.pipedream.net -->
    <form method="GET" onsubmit="return handleSubmit('https://eniuu7vo8sak.x.pipedream.net/Home/Browse')">
      <input type="text" name="Term" />
      <input type="text" name="Address" />
      <input type="submit" value="submit">
    </form>

    <script>

      function handleSubmit(url) {
        removeEmptyParameters();
        const formData = $('form').serialize();
        console.log(formData);
        // Only adds the question mark to the url only if there are some input data.
        if (formData) {
          url = `${url}?${formData}`;
        }
        $.get(url);
        return false;
      }

      function removeEmptyParameters() {
        // set the name attribute = "" for empty inputs, so they won't be posted to server
        $('form').find('input').each(function () {
          if (this.value === "") {
            $(this).attr('name', '');
          }
        });
      }            
    </script>

  </body>

</html>

【讨论】：

请说明解决问题的方式和原因，这将真正有助于提高您的帖子质量，并可能导致更多的赞成票。
@Android 感谢您的建议。我已经编辑了帖子以包含一些 cmets。