首页 > 解决方案 > 为什么单击自动完成结果时会在 url 中添加 #?

问题描述

下面的代码做了我想要的,但是每次我点击从数据库中获取的自动编译值时,该值确实会添加到输入字段中,但然后在页面 url 中说 index.php# 添加了一个哈希值。

如何防止这种情况有人能给我一个解决方案?

这是我的 JS

$(document).ready(function () {
    $("#from-input").keyup(function () {
    let searchText = $(this).val();
    if (searchText != "") {
      $.ajax({
        url: "airports.php",
        method: "post",
        data: {
          query: searchText,
        },
        success: function (response) {
          $("#from-show-list").html(response);
        },
      });
    } else {
      $("#from-show-list").html("");
    }
    });
    // Set searched text in input field on click of search button
   $(document).on("click", "#from-show-list a", function() {
        $("#from-input").val($(this).text());
        $("#from-show-list").html("");
    });
  });
  
  
  $(document).ready(function () {
  $("#to-input").keyup(function () {
    let searchText = $(this).val();
    if (searchText != "") {
      $.ajax({
        url: "airports.php",
        method: "post",
        data: {
          query: searchText,
        },
        success: function (response) {
          $("#to-show-list").html(response);
        },
      });
    } else {
      $("#to-show-list").html("");
    }
    });
    // Set searched text in input field on click of search button
  $(document).on("click", "#to-show-list a", function() {
        $("#to-input").val($(this).text());
        $("#to-show-list").html("");
    });
  });

这是html

<div class="col-sm-12 col-lg-6">
                        <label class="form-label-outside">Origin</label>
                        <div class="form-wrap form-wrap-modern">
                          <input id="from-input" class="form-input" name="from" type="text" autocomplete="off" placeholder="Airport/City Name">
                         <div id="from-show-list" class="list-group" style="z-index: 9999; position:absolute; max-height: 200px;  overflow: auto;"></div>
                        </div>
                      </div>
                      <div class="col-sm-12 col-lg-6">
                        <label class="form-label-outside">Destination</label>
                         <div class="form-wrap form-wrap-modern">
                         <input id="to-input" class="form-input"  name="to" type="text" autocomplete="off" placeholder="Airport/City Name">
                        <div id="to-show-list" class="list-group" style="z-index: 9999; position:absolute; max-height: 200px;  overflow: auto;"></div>
                        </div>
                      </div>

非常感谢提前

标签: jquery

解决方案


删除 PHP 代码中的 'href = "#"' 部分,再次单击它时它不会显示。

尽管如此,JavaScript 函数还是会运行!


推荐阅读