如何使用另一個元素的onClick事件更改div的backgroundPosition

如何將它放在一起？我在這個網站上工作，要求每次點擊菜單中的某個項目時，兩個特定DIV的背景位置會發生變化並保持選擇狀態。如何使用另一個元素的onClick事件更改div的backgroundPosition

這裏是我的嘗試：

首先，我創建了一個變量「P」，以節省網址/地址選定的頁面，因此，例如，如果你在關於我們，你可能會看到這樣的事情上地址欄：

website.com/index.php?p=aboutus

在菜單，按鈕關於我們我這樣做是通過調用函數changeBG的onClick：

<a href="?p=aboutus" onclick="changeBG()">About Us</a>

我想我需要JavaScript來做伎倆，這裏是我的股票。

這是雲頭中的腳本：

<script type="text/javascript"> 
    <? 
// Set "p" value to HOME if previously empty. 
if ($_GET['p']=='') $_GET['p']='home'; 
    ?> 
function changeBg(pvalue) { 
if (pvalue == '') {pvalue = '<?=$_GET['p'];?>'; 
    } 
    if (pvalue=='aboutus'){ 
    document.getElementById('this_is_the_first_to_be_changed').style.backgroundPosition=0 20px; 
      document.getElementById('this_is_the_other_to_be_changed').style.backgroundPosition=0 80px; 

      if (pvalue=='contactus'){ 
      document.getElementById('this_is_the_first_to_be_changed').style.backgroundPosition=0 10px; 
        document.getElementById('this_is_the_other_to_be_changed').style.backgroundPosition=0 100px; 
    } 

      } 
    </script>

這就是那張體：

<div id="left_menu"> 
<a href="?p=aboutus" onclick="changeBG()">About Us</a> 
<a href="?p=contact" onclick="changeBG()">Contact Us</a> 
</div> 
<div id="this_is_the_first_to_be_changed"> 
</div> 
<div id="this_is_the_other_to_be_changed"> 
</div>

任何人都可以找出爲什麼不起作用？

來源

2012-01-02 Vinicius Santana

我不知道它爲什麼不起作用，但我強烈要求你不要混淆你的業務邏輯和顯示邏輯。只是因爲PHP使它成爲可能，並不意味着它是一個好主意。很快你就會發現完全不可讀的代碼（如上例所示）。試圖弄清楚哪些部分是PHP和哪些部分是Javascript是絕對的噩夢（因爲它們是如此相似的外觀語言），所以你應該盡一切可能使它們保持獨立。 – 2012-01-02 20:25:02

我同意你的看法，但你看到的只是冰山的一部分。你可以在整個項目中挑選一下： www.daterraweb.com/projects/brazilpax/site/v1/ 我實際上想要做的是將左側和頂部菜單分別移動藍色箭頭上下和側身，所以他們會匹配完整的黃色箭頭。如果你有一個更好的主意，請 – 2012-01-02 22:00:21

嘗試使用引號： style.backgroundPosition =「0 20px」;

修訂

而且，你看這個行： p值= '';

要設置p值= '=關於我們'

修訂

腳本元素是不正確的：

<script type="java/text">

權：

<script type="text/javascript">

除了使用螢火蟲或chrome來查看頁面中生成的JS。

來源

2012-01-02 20:32:28 EricSonaron

編號。行情沒有做到這一點，但我想知道是否使用它，不會將值變成一個字符串？ – 2012-01-02 21:57:42

是的......那個理想。用p的值填充pvalue。P是單擊菜單上的項目時值發生變化的變量。我使用href =「？p = aboutus」來做到這一點。無論如何。 pvalue正在接收正確的內容。問題在於條件。如果你想看到真正的項目，請訪問，www.daterraweb.com/projects/brazilpax/site/v1/ – 2012-01-02 22:14:46

哦..我明白你在說什麼。是的，它是多餘的，但最終pvalue仍然獲得正確的價值。 – 2012-01-02 22:22:36

如何使用另一個元素的onClick事件更改div的backgroundPosition

回答

相關問題