Question

我是Javascript的新手，并试图学习这门语言。我还不知道CSS或jquery。我计划最终只学习一种语言，我不是很聪明。我正在尝试制作一个按钮，根据增长变量自动移动颜色。我希望按钮开始绿色。当变量增长等于或大于进化成本时，按钮颜色应该没有任何按钮点击变为红色。当变量增长小于进化成本时，按钮颜色应该没有任何按钮点击更改为绿色。

按照我的编码，按钮颜色为黑色，无论如何都不会改变颜色。我不知道自己做错了什么。

请解释任何解决方案，以便我可以学习。

这是HTML部分。

<p title="Click to gain evolution points to evolve your cell."><button type="button" class="btn" id="evolutionButton" onclick="buyEvolution()"><b>Evolve</b></button></p>
<p style="color:white" title="Evolution points are used to purchase evolutions.">Evolution: <span id="evolution">0</span></p>
<p style="color:white" title="Each additional Evolution point costs more growth to create.">Evolution Cost: <span id="evolutionCost">100</span></p>

这是Javascript部分。

var growth = 0;
function GrowthClick(number){
    growth = growth + number;
    document.getElementById("growth").innerHTML = growth;
};

var evolution = 0;

function buyEvolution(){
    var evolutionCost = Math.floor(100 * Math.pow(2,evolution));
    if(growth >= evolutionCost){
        evolution = evolution + 1;
        growth = growth - evolutionCost;
        document.getElementById('evolution').innerHTML = evolution;
        document.getElementById('growth').innerHTML = growth;
    };
    var nextCost = Math.floor(100 * Math.pow(2,evolution));
    document.getElementById('evolutionCost').innerHTML = nextCost;
};

var evolutionButton;

function colorEvolution(){
    if (growth >= evolutionCost {     
        document.getElementById("evolutionButton").className = "red"; 
    } else {
        document.getElementById("evolutionButton").className = "green";
    }
    document.getElementById('growth').innerHTML;
    document.getElementById('evolutionCost').innerHTML;
};

Answer 1

我会使用switch语句将其保留在函数之外，但这应该能够根据增长变量的值更改按钮的颜色。

<?php
$dates = "2017-02-26, 2017-02-27, 2017-03-01";
$dates = explode(',', $dates);

$conseq = array(); 
$ii = 0;
$max = count($dates);

for($i = 0; $i < count($dates); $i++) {
    $conseq[$ii][] = date('Y-m-d',strtotime($dates[$i]));

    if($i + 1 < $max) {
        $dif = strtotime($dates[$i + 1]) - strtotime($dates[$i]);
        if($dif >= 90000) {
            $ii++;
        }   
    }
}

print_r($conseq);
?>

我发现您通过在此处更改其类名来尝试更改颜色 {{1}} 但我相信switch语句会更容易

Answer 2

有人通过教我新的编程方面帮助我在另一个网站。然后我写了这个并且它有效。

HTML

    <p title="Click to gain evolution points to evolve your cell."><button type="button" id="evolutionButton" onclick="buyEvolution()"><b>Evolve</b></button></p>
    <p style="color:white" title="Evolution points are used to purchase evolutions.">Evolution: <span id="evolution">0</span></p>
    <p style="color:white" title="Each additional Evolution point costs more growth to create.">Evolution Cost: <span id="evolutionCost">100</span></p>

的Javascript

var growth = 0;

function updateGrowth() {
document.getElementById('growth').innerHTML = growth;
colorEvolution();
};

function GrowthClick(number){
growth = growth + number;
updateGrowth();
};

var evolution = 0;

function updateEvolution() {
document.getElementById('evolution').innerHTML = evolution;
};

var evolutionCost;

function buyEvolution(){
evolutionCost = Math.floor(100 * Math.pow(2,evolution));
if(growth >= evolutionCost){
    evolution = evolution + 1;
    growth = growth - evolutionCost;
    updateEvolution();
    updateGrowth();
};
var nextEvolution = Math.floor(100 * Math.pow(2,evolution));
document.getElementById('evolutionCost').innerHTML = nextEvolution;
};

function colorEvolution(){
var evolutionColor = document.getElementById("evolutionButton");
evolutionCost = Math.floor(100 * Math.pow(2,evolution));
if (growth >= evolutionCost) {evolutionColor.style.color = "red";}
else {evolutionColor.style.color = "green";}
};

按钮颜色问题

2 个答案: