Question

我正在尝试通过javascript创建一个二十一点的通用游戏。单击开始按钮后游戏开始：

<button type="button" onClick="deal()">Start Game</button>

反过来运行方法交易：

function deal() {  
    card1 = Math.floor(Math.random() * 52);  
    card2 = Math.floor(Math.random() * 52);  
    card1 = changeCard(card1);  
    card2 = changeCard(card2);  
    score = card1 + card2;  
    for (var i = 0; i < aceAmount || score > 21;aceAmount--) {  
        score -= 10;  
    }  
    document.write("You were dealt a " + card1 + " and a " + card2 + " for a total of " + score + ".\nDo you wish to hit or pass?");  
    aceAmount = 0;  
};

我的问题是，一旦交易方法运行，我怎样才能在屏幕上显示两个html按钮，例如：

<button type="button" onClick="hit()">Hit</button>  
<button type="button" onClick="pass()">Pass</button>

Answer 1

怎么办？使用CSS display property隐藏您的按钮，然后使用getElementById方法“选择”这些按钮，在它们上面做一些“Javascripty”。

您的HTML

<button id="hit_btn" style="display:none;" type="button" onClick="hit()">Hit</button>  
<button id="pass_btn" style="display:none;" type="button" onClick="pass()">Pass</button>

并将其添加到您的Javascript函数中：

document.getElementById('hit_btn').style.display = '';
document.getElementById('pass_btn').style.display = '';

当你想再把它们藏起来时

document.getElementById('hit_btn').style.display = 'none';
document.getElementById('pass_btn').style.display = 'none';

Answer 2

您可以在按钮上设置ID或类，并使用display：none设置css规则。在交易功能结束时，设置一行将显示更改为阻止或内联。在jQuery中，它将是

$('button.hit').css({visibility: "visible"})

javascript函数完成后会显示html

2 个答案: