模态后出现在URL中的符号

Question

这似乎是一个小问题，但是为什么符号＃！打开和关闭我的模式后出现在我的URL中？

这是我脚本标签中的内容。问题可能位于这里。

<script>
 $( document ).ready(function(){
  $(".button-collapse").sideNav({menuWidth: 320, activationWidth: 70, edge: 'right', closeOnClick: true});
  $('#modal2').modal();
  $('#modal1').modal();
 });
</script>

编辑：添加了模态链接，该链接是导轨搜索表格。modal2本质上是相同的，但是对于不同的分辨率

<div id="modal1" class="modal hide-on-med-and-down">
 <div class="modal-content">
  <div class="center-align">
   <h4>Looking for something?</h4>
    <div class="search_form">
     <%= form_tag search_posts_path, method: :get, id: "post-lookup-form" do %>
     <div id="search_border" class="form-group">
      <%= text_field_tag :post, params[:post], placeholder: "  Search Posts", autofocus: true, id: "search_box" %>
     </div>
    <% end %>
   <div>
    <a id="cancel" href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Cancel</a>
  </div>
  </div>
 </div>
</div>

这简短导致对我的侧面导航的悬停效应停止工作。我通过在CSS中手动进入悬停效果来修复它，但是我的感觉很糟糕，我真的没有解决主要问题，这会在稍后在路上咬我。

我目前正在为该项目使用0.100.2版本的材料。让我知道您是否需要更多信息或代码。

Answer 1

这是因为这一行

<a id="cancel" href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Cancel</a>

将href更改为 href=''值，并且不会再将其放入URL中。