物化Navbar下拉菜单不起作用

时间:2018-05-21 18:03:19

标签: jquery drop-down-menu materialize

由于某种原因,此部分中显示的下拉列表不起作用。 https://materializecss.com/navbar.html#! 在控制台中没有错误,它只是不起作用,我已经研究并尝试了几个解决方案,我发现github和codepen但似乎没有解决它,它可能是由库版本引起的吗?我该怎么办?这是我的代码

 $(document).ready(function(){
$(".dropdown-trigger").dropdown();
});

和调用jquery之后的脚本

     <form id="form1" runat="server">
        <div>

                <asp:Repeater ID="rptrComments"  runat="server" 
             OnItemCommand="rptList_ItemCommand">

               <ItemTemplate>
                    <div id="Container">


            <div id="OverveiwWrapper">
   <table id="TblOverveiw" style="/*border: 1px solid black;*/ width:165PX;  
             height:170PX" >
             <tr>
             <td id="TdTitle"> <%#Eval("IdeaTitle")%></b></td></tr>
            <tr>
              <td id="TdStatus"><%#Eval("IdeaDescription")%></td></tr>
            <tr>
              <td id="TdPrice"><%#Eval("Category")%></td></tr>
            <tr>
    <td id="TdAddress"><%#Eval("Date")%></td></tr>

          </table>
 </div>
          <div id="DescriptionWrapper">
        <p id="PropType">  Property type : <%#Eval("IdeaTitle")%>  </p>
         <p id="PropDescription"  ><%#Eval("Category")%></p>
       <asp:LinkButton  ID="testing"  runat="server" Text="More Details" 
      CommandName="click" CommandArgument='<%#Eval("IdeaTitle")%>' 
        Visible="true" ></asp:LinkButton>
     <asp:DataList ID="DataList1" runat="server"></asp:DataList>
         </div>
           </div>

        </ItemTemplate>
             </asp:Repeater>

1 个答案:

答案 0 :(得分:0)

$(".dropdown-trigger").dropdown();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>

<ul id="dropdown1" class="dropdown-content">
  <li><a href="#!">one</a></li>
  <li><a href="#!">two</a></li>
  <li class="divider"></li>
  <li><a href="#!">three</a></li>
</ul>
<nav>
  <div class="nav-wrapper">
   
    <ul class="left ">
      <!-- Dropdown Trigger -->
      <li><a class="dropdown-trigger" href="#!" data-target="dropdown1">Dropdown</a></li>
    </ul>
  </div>
</nav>

链接

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>