根据数组中的值创建进度条

我想根据放入变量的信息动态创建进度条。但是，这是行不通的：/（我还是一个noob）有人可以看看，也许告诉我什么是错的？根据数组中的值创建进度条

$skills = array("HTML & CSS:" => $htmlcss, 
      "Bootstrap:" => $bootstrap, 
      "PHP & MySql:" => $phpmysql, 
      "jQuery & JavaScript:" => $jqueryjavascript); 
$arrLen = array_count_values($skills); 

//foreach($skills as $x => $x_value) 
while($x <= $arrLen) 
{ 
    echo " 
     <p>$key</p> 
     <div class='progress'> 
      <div class='progress-bar progress-bar-striped active' role='progressbar' aria-valuenow=$value aria-valuemin='0' aria-valuemax='100' style='width: $value %> 
      </div> 
     </div> 
    "; 
    $x++; 
}

旧代码：

<?php 

$htmlcss = 80; 
$bootstrap = 70; 
$phpmysql = 50; 
$jqueryjavascript = 5; 

$skills = array("HTML & CSS:" => $htmlcss, 
      "Bootstrap:" => $bootstrap, 
      "PHP & MySql:" => $phpmysql, 
      "jQuery & JavaScript:" => $jqueryjavascript); 
$arrLen = array_count_values($skills); 

foreach($skills as $x => $x_value) 
{ 
    echo " 
     <p>$x</p> 
     <div class='progress'> 
      <div class='progress-bar progress-bar-striped active' role='progressbar' aria-valuenow=$x_value aria-valuemin='0' aria-valuemax='100' style='width: $x_value %> 
      </div> 
     </div> 
    "; 
} 
echo "Done";

来源

2016-05-31 Christian Job Kaal

您需要的foreach循环来获取当前进度$ X_VALUE –

foreach循环已被禁用，不使用$ X_VALUE。我曾尝试使用$ x和$ x_value的foreach循环，但也导致了错误。现在不在我的电脑上，所以我不能复制/粘贴错误，在几个小时后回家时会这样做。 –

你评论过的'foreach'有什么问题吗？此外，你正在回应变量'$ key'，它不会在任何地方初始化。 – Antti29

貌似无效HTML/CSS。 HTML代码在div属性上缺少适当的换行引号。

也width: $x_value %无效，因为它会导致为width: 80 %这是无效的风格。它应该是width: $x_value%

最后，除非您的整个网站使用单引号，否则您应该遵循在由PHP创建的HTML中使用双引号。混合单引号和双引号可能会在某些浏览器中正确显示，而其他浏览器则会错误显示（W3C Specification）。

当使用PHP输出HTML时，可以使用NOWDOC或HEREDOC字符串样式，以方便地使用双引号或单引号以及变量。

<?php 
$htmlcss = 80; 
$bootstrap = 70; 
$phpmysql = 50; 
$jqueryjavascript = 5; 
$skills = [ 
    'HTML & CSS:' => $htmlcss, 
    'Bootstrap:' => $bootstrap, 
    'PHP & MySql:' => $phpmysql, 
    'jQuery & JavaScript:' => $jqueryjavascript 
]; //PHP 5.4 array syntax 
foreach($skills as $x => $x_value) { 
    echo <<<EOL 
    <p>$x</p> 
    <div class="progress"> 
     <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="$x_value" aria-valuemin="0" aria-valuemax="100" style="width: $x_value%"> 
     </div> 
    </div> 
EOL; 
}

结果：

来源

2016-05-31 15:00:33 fyrye

谢谢，这工作！我从中学到了很多东西，我会尽力理解你给我看的所有代码。 –

根据数组中的值创建进度条

回答

相关问题