如何在我的asp.net应用程序中使用css和javascript菜单？

-3

嗨，我想在我的asp.net应用程序中测试一个菜单，但我得到一个JavaScript错误。如何在我的asp.net应用程序中使用css和javascript菜单？

这里我的aspx：

<nav id="cbp-hrmenu" class="cbp-hrmenu"> 
    <ul> 
     <li> 
      <a href="#">Products</a> 
      <div class="cbp-hrsub"> 
       <div class="cbp-hrsub-inner"> 
        <div> 
         <h4>Learning & Games</h4> 
         <ul> 
          <li><a href="#">Catch the Bullet</a></li> 
          <li><a href="#">Snoopydoo</a></li> 
          <!-- ... --> 
         </ul> 
        </div> 
        <div> 
         <h4>Utilities</h4> 
         <ul> 
          <li><a href="#">Gadget Finder</a></li> 
          <li><a href="#">Green Tree Express</a></li> 
          <li><a href="#">Green Tree Pro</a></li> 
          <li><a href="#">Wobbler 3.0</a></li> 
          <li><a href="#">Coolkid</a></li> 
         </ul> 
        </div> 
        <div> 
         <!-- ... --> 
        </div> 
       </div><!-- /cbp-hrsub-inner --> 
      </div><!-- /cbp-hrsub --> 
     </li> 
     <li><!-- ... --></li> 
     <li><!-- ... --></li> 
     <!-- ... --> 
    </ul> 
</nav>

这里的JavaScript：

var cbpHorizontalMenu = (function() { 

    var $listItems = $('#cbp-hrmenu > ul > li'), //<--error $listItems is undefine 
     $menuItems = $listItems.children('a'), 
     $body = $('body'), 
     current = -1; 

    function init() { 
     $menuItems.on('click', open); 
     $listItems.on('click', function(event) { event.stopPropagation(); }); 
    } 

    function open(event) { 

     if(current !== -1) { 
      $listItems.eq(current).removeClass('cbp-hropen'); 
     } 

     var $item = $(event.currentTarget).parent('li'), 
      idx = $item.index(); 

     if(current === idx) { 
      $item.removeClass('cbp-hropen'); 
      current = -1; 
     } 
     else { 
      $item.addClass('cbp-hropen'); 
      current = idx; 
      $body.off('click').on('click', close); 
     } 

     return false; 

    } 

    function close(event) { 
     $listItems.eq(current).removeClass('cbp-hropen'); 
     current = -1; 
    } 

    return { init : init }; 

})();

我必须做:(

来源

2014-02-27 Tarasov

如果你正在使用jQuery的 - 不要在你的变量名使用$。 –

no jquery ...... – Tarasov

$（'＃cbp-hrmenu> ul> li'）是jQuery语法，所以看起来您正在使用jQuery或其他使用类似语法的库。你也使用jQuery函数，如on（）和removeClass（），所以我很确定它是jQuery。 –

你有添加CSS到你的ASP.NET应用程序

？

<link rel="stylesheet" runat="server" media="screen" href="~/css/styles.css" />

to crea与JavaScript文件和ASP.NET文件TE集成，您可以只需添加*.js您<head>标签，通过这样做：

<head runat="server"> 
<script src="FileName.js" type="text/javascript"></script> 
</head>

我还注意到，您正在使用jQuery库，你可能没有包括。把它也放在你的<head>标签里。

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

来源

2014-02-27 14:32:45 rolory

如何在我的asp.net应用程序中使用css和javascript菜单？

回答

相关问题