在哪裏可以正常使用此代碼的JavaScript

1. 「的index.php」

<div id="content"> 
    <?php include_once("template_main_aside.php"); ?> 
</div> 

<?php include_once("template_footer.php"); ?>

2. 「template_main_aside.php」

<aside id="main_aside"> 
    <ul id="menu1"> 
     <li><a href="#">Menu1</a></li> 
     <li><a href="#">Menu2</a></li> 
     <li><a href="#">Menu3</a></li> 
     <li><a href="#">Menu4</a></li> 
     <li><a href="#">Menu5</a></li> 
     <li><a href="#">Menu6</a></li> 
    </ul> 
</aside>

3. 「的style.css」

#content { 
    background-color: white; 
    display: block; 
    overflow: hidden; 
    height:1000px; 
    box-shadow: 0px 0px 7px #999; 
} 
#content > #main_aside { 
    padding-top: 30px; 
    width: 19%; 
    float: left; 
    box-shadow: 0px -2px 7px #999; 
} 
#content > #main_aside > ul { 
    margin:0; 
    padding:0; 
} 
#content > #main_aside > ul:first-child > li { 
    display: block; 
    margin: 0 0 20px 20px; 
    border-bottom: 1px solid #999; 
    padding-bottom: 10px; 
} 
#content > #main_aside > ul:first-child > li:last-child { 
    border-bottom: none;  
} 
#content > #main_aside > ul > li > a { 
    display: block; 
    padding: 5px 7px 7px 10px; 
} 
#content > #main_aside > ul > li > a:hover { 
    background: #fdb945; 
    color: #fff; 
} 
.selected a { 
    background: #fdb945; 
    color: #fff; 
}

最後，

我嘗試使用下面的JavaScript代碼來鎖定橙色背景選擇的菜單導航的風格：

<script> 
    $(function() { 
     $('#menu1 li').click(function() { 
      $('#menu1 li').removeClass('selected'); 
      $(this).addClass('selected'); 
      //$('a', this).addClass('selected'); 
     }); 
    }); 
</script>

它的工作原理當我做到這在JSFiddle：

但是當我正在處理我的本地文件時，我不確定我應該把JavaScript放在哪裏。我試過「index.php」的主體部分，在「template_main_aside.php」的末尾，但都不起作用。

請幫忙！

來源

2014-11-25 Yun C Han

你有jQuery的提供給你的頁面？你在控制檯中看到任何錯誤嗎？ – Lix 2014-11-25 14:17:28

把它放到一個JS文件中。然後讓腳本標記加載jquery，之後爲你自己的JS文件 – progsource 2014-11-25 14:18:06

把它剛剛閉幕body標籤之上，但一定要放一個參考jQuery的IE瀏覽器

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script> 
      $(function() { 
       $('#menu1 li').click(function() { 
        $('#menu1 li').removeClass('selected'); 
        $(this).addClass('selected'); 
        //$('a', this).addClass('selected'); 
       }); 
      }); 
     </script> 
    </body> 
</html>

前

編輯：

src鏈接到jQuery，這是你正在使用的框架！（所有這些$標誌）。在開始使用jquery之前，在頁面中引用jquery總是很重要的。在我已經從谷歌CDN中加載它的例子中，實際上它可能是在你自己的服務器上或本地的版本。在這種情況下，您只需鏈接到相對 - 例如，如果它在您的js文件夾中名爲jquery那麼它將是：/js/jquery.js。

來源

2014-11-25 14:24:11 Djave

這個工程！謝謝@Djave btw什麼是src鏈接？我應該總是添加它，每當我使用JavaScript？ – 2014-11-25 14:48:26

查看我的更新回答:) – Djave 2014-11-25 17:31:30

謝謝！它幫了我很多：D – 2014-11-27 08:39:22

您必須將其放入<head>標記中。

<head> 
<script> 
your js code here 
</script> 
</head>

您也可以參考JS文件

<script src="yourJSfile.js"></script>

如果你的代碼還包含你要添加的jQuery腳本屁股很好的jQuery。你可以在這裏下載：http://jquery.com/download/

然後加入這樣的：

<script type="text/javascript" src="jquery-1.11.1.min.js"></script>

來源

2014-11-25 14:21:48 blckbird

你可以添加JavaScript代碼到PHP文件，但CSS。

試試這個

添加JavaScript來

「template_main_aside.php」文件。

像

`<script> 
your js code here 
</script> 
<aside id="main_aside"> 
<ul id="menu1"> 
    <li><a href="#">Menu1</a></li> 
    <li><a href="#">Menu2</a></li> 
    <li><a href="#">Menu3</a></li> 
    <li><a href="#">Menu4</a></li> 
    <li><a href="#">Menu5</a></li> 
    <li><a href="#">Menu6</a></li> 
</ul> 
</aside>`

來源

2014-11-25 14:32:11 RatheeshBabu

呦可以在HTML或PHP文件提出的JavaScript的任何地方。在頁腳中加載JavaScript是Web開發中的流行趨勢。因爲它增加了一些頁面的速度。首先加載HTML代碼，然後JavaScript開始工作。所以在index.php

<html> 
     <head> 
     </head> 
     <body> 
     <div id="content"> 
     <?php include_once("template_main_aside.php"); ?> 
     </div>  
     <?php include_once("template_footer.php"); ?> 
    <!--jquery (load jquery.min.js before any coding on jquery)--> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <script> 
     $(function() { 
      $('#menu1 li').click(function() { 
       $('#menu1 li').removeClass('selected'); 
       $(this).addClass('selected'); 
       //$('a', this).addClass('selected'); 
      }); 
     }); 
    </script> 
     </body> 
    </html>

或爲JavaScript代碼創建單獨的文件。這樣代碼更易於管理。在你的index.php

 <html> 
      <head> 
      </head> 
      <body> 
      <div id="content"> 
      <?php include_once("template_main_aside.php"); ?> 
      </div>  
      <?php include_once("template_footer.php"); ?> 
     <!--jquery (load jquery.min.js before any coding on jquery)--> 
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
      <script src="url/to/main.js"> 

      </body> 
    </html>

，並在您main.js

$(function() { 
       $('#menu1 li').click(function() { 
        $('#menu1 li').removeClass('selected'); 
        $(this).addClass('selected'); 

       }); 
      });

來源

2014-11-25 14:51:16 lcshobin

在哪裏可以正常使用此代碼的JavaScript

回答

相關問題