對於每個數組項目鏈接頁面上的另一個背景顏色

現在在第1頁我有每個數組項目的HTML鏈接。每個數組項目具有不同的顏色。當點擊8個html鏈接中的一個時，它將重定向到第2頁。在那裏，我想要div-background獲取鏈接到數組項的顏色。

我的PHP代碼生成每個數組項的類名：.feeling1, .feeling2, .feeling3, .feeling4, .feeling5, ... 現在這似乎很容易通過簡單地說，與類名（例如）.feeling1一個元素上單擊時則頁面上更改DIV（id="resultaat"）的background-color 2.但顯然這個代碼將無法工作...

任何人的解決方案呢？提前致謝。

 [ 
     "mood" => "social", 
     "number"=>"feeling4", 
     "name"=>"DOK FLEA MARKET", 
     "picture" => "images/treasures/social.png", 
     "about" => "Every Sunday till the end of September there's a flea market full with people selling their odds and ends, homemade stuff and art ", 
     "street"=>"Koopvaardijlaan 4", 
     "city"=>"GHENT", 
     "days"=>"opening days: Sunday", 
     "hours"=>"opening hours: 10:00AM-6:00PM " 

     ],

第1頁：：

實施例一個數組項

<body> 
<!--CONTAINER--> 
<div id="container"> 

    <!--HEADER--> 
    <header> 
     <h1 id="headertitel">PICK YOUR MOOD</h1> 
    </header> 

    <!--SECTION--> 
    <section id="middenstuk"> 

     <ul class="list"> 

      <?php foreach ($arr_artist as $key=> $artist) { echo " 
      <li class='".$artist[' number ']."'><a href='3.php?id=".$key."' class='feeling".$artist[' mood '].", trala'>".$artist['mood']."</a> 
      </li>"; } ?> 

     </ul> 

     <script> 
      $(".feeling").mousedown(function() { 
       $(this).addClass('slideright'); 
      }); 
     </script> 

    </section> 

    <!-- FOOTER --> 
    <footer> 

     <a class="linkhome1" href="4.php"> 
      <div class="locatie"></div> 
     </a> 
     <a class="linkhome1" href="index.php"> 
      <div class="home"></div> 
     </a> 

    </footer> 
</div>

jQuery代碼：

$(".feeling2").click(function() { 
     $("#resultaat").css("background-color", "red");      
    });

來源

2015-05-20 Ande Timmerman

可以包含'html'嗎？創建stacksnippets http://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/，的jsfiddle http://jsfiddle.net證明？ – guest271314

現在添加了第1頁的html –

嘗試過jsfiddle.net，但在我的情況下，2個html頁面都受到影響，所以我想我不能真的用這種方式測試我的代碼......不過jsfiddle批准了我的jQuery代碼。 –

如果正確地解釋的問題，2 html存在。在「page1」點擊<a>元素應該呈現特定元素#resultaatbackgroundred在「page2」？

嘗試

在「第1頁」

<!DOCTYPE html> 
<html> 
<head> 
<script src="jquery-1.11.3.js"> 
</script> 
</head> 
<body> 
<ul> 
<li><a class="feeling2" href="page2.html">feeling 2</a> 
</ul> 
<script> 
    $(".feeling2").click(function (e) { 
    // pass settings to `page2` by appending `"?id=resultaat&background=red"` 
    // to `.feeling2` `.href` 
    e.target.href = e.target.href + "?id=resultaat&background=red"; 
    }); 
</script> 
</body> 
</html>

在「第2頁」

<!DOCTYPE html> 
<html> 
<script src="jquery-1.11.3.js"> 
</script> 
</head> 
<body> 
     <div id="resultaat"> 
      <img src="images/moods/lazy180.png" alt="Logo" /> 
      <img src="" class="moodpics" alt="artist name" /> 
      <!--<p>description</p>--> 
      <p class="about">about</p> 
      <p class="street">street</p> 
      <p class="city">city</p> 
      <p class="days">days</p> 
      <p class="hours">hours</p> 
      <a class = "vernieuwen" href="3.php?id=1" ><div class=""></div></a> 
     </div> 
<script> 
$(document).ready(function() { 
    // parse `location.search` `?id=resultaat&background=red` , 
    // set at `click` of `.feeling2` at `page1` 
    var mood = location.search.slice(1).split(/=|&/); 
    // select element having `id` `resultaat` , 
    // set `$("[id=resultaat]")` `css` `background`:`red` 
    $("["+mood[0]+"="+mood[1]+"]").css(mood[2], mood[3]); 
}) 
</script> 
</body> 
</html>

來源

2015-05-20 15:47:54 guest271314

感謝您的回答和幫助guest271314！您的解決方案可能會工作，但僅適用於類名爲.feeling2的。見下面我找到的解決方案。 –

@AndeTimmerman Post作爲基本模板來嘗試。可能會使用'$（「[class^= feeling]」）'selector來定義'click'事件，將特定的「心情」或「顏色」附加爲'data- *'屬性，這會改變'click'處理程序稍微改爲'e.target.href = e.target.href +「？id = resultaat＆background =」+ this.dataset.mood;'，其中「心情」是一種「顏色」。該方法應該爲每個'.feeling *'元素提供相同的結果。 – guest271314

我已經找到了我的「問題」的解決方案只需2頁上添加以下代碼：

<div class="<?php echo $arr_artist[$artist_id]['number']?>" id="resultaat">

來源

2015-05-20 20:42:11

對於每個數組項目鏈接頁面上的另一個背景顏色

回答

相關問題