单击PHP显示数组值

时间:2013-05-19 10:03:24

标签: php javascript html css

让我们做对了!

我做了一个PHP计算,我不想在我的网站上显示。棘手的部分是每次用户点击按钮上的 ONCE 时,我希望显示值, ONE 值。它不是什么样的按钮并不重要,我只是不想在每次点击时显示一个值。值的总数是8(固定长度),现在我有4个数组,每个数组有2个值。因此,每件事都完成并保存,我只是试图展示它,当时只有一个。如果它更容易,我可以将它们聚集在一起。我试图制作一种display:none vs display onclick thingy,但它只显示每次点击的第一个值。非常感谢提示和技巧!请问FORM会帮助我吗?改为使用input

这就是我所拥有的:

HTML

<a href="#" class="modern" onClick="showhide('first', 'block'); return false" >Give me your value</a>

<div id="first"><?php echo $team1[0];?></div>
<div class="secound"><?php echo $team1[1];?></div>
<div class="third"><?php echo $team2[0];?></div>
<div class="fourth"><?php echo $team2[1];?></div>
...

的Javascript

function showhide(divid, state){
 document.getElementById(divid).style.display=state
}

...

1 个答案:

答案 0 :(得分:4)

您可以通过多种不同方式实现这一目标。使用框架可以让您更容易,更轻松地支持多个浏览器,但假设这不是目标,并坚持与您拥有的一样多......

我已经改变了PHP:

<a href="#" id="team-next">Give me your value</a>
<div id="teams">
  <div id="team-0"><?= $team[0][0] ?></div>
  <div id="team-1"><?= $team[0][1] ?></div>
  <div id="team-2"><?= $team[1][0] ?></div>
  <div id="team-3"><?= $team[1][1] ?></div>
  ...

请注意,我已将id更改为前缀team-和索引0 ... n,并且团队出现在具有id团队的父元素中。我还将数组更改为多维数组,而不是包含数字的多个变量。可以通过将数组添加为数组项来创建此构造。现在JavaScript(这应该出现在上面HTML之后的脚本标记中):

// Initial index -1 (nothing displayed)
var current = -1;

// How many teams are there?
var count = document.getElementById("teams").children.length;

// The handler
function showNext() {

  // A bit of modulus math, when it gets to the
  // same value as the count it starts at 0 again
  var next = (current + 1) % count;

  // Hide the previous one, unless it is the first
  if(current !== -1)
    document.getElementById("team-" + current).removeAttribute("style");

  // Show the next one
  document.getElementById("team-" + next).style.display = "block";

  // Update the current index
  current = next;
} 

// Bind the event listener
document.getElementById("team-next").addEventListener("click", showNext, false);

Here is a fiddle