javascript - onclick 向按钮输入值

Question

该脚本是一个赌博游戏。用户输入赌注和 2、3、5、50 中的数字。 如果轮盘转动，并且轮盘上的数字等于数字，则用户获得赌注*数字。

示例:用户下注 100 个积分并押注于 2。轮盘旋转，如果落在 2 上，用户将获得 100*2 积分。

如何将输入中的 2、3、5、50 分别更改为“下注 2”、“下注 3”按钮。

我当前的问题:只要轮盘旋转时提供有效的赌注和数字，用户就可以进入每一轮。使用按钮，将允许用户选择何时下注(通过单击按钮)

看看这个: http://codepen.io/hokaien/pen/RKjPbZ

if ( options[index] === wantTo ) {
// if options[index] equals to number
    var el = document.getElementById('number');
    var res = originalNumber += (amountBet * wantTo);
    el.textContent = res;
    finalMsg = " You won " + (amountBet * wantTo) + " credits";
  } else if (test3 != "2" || test3 != "3" || test3 != "5" || test3 != "50") {
    finalMsg = " Number should be from 2, 3, 5, 50 ";
  } else if (amountBet > originalNumber) {
    finalMsg = " Not enough credits ";
  } else if (amountBet < 0) {
    finalMsg = " Cannot bet negative ";
  }

Answer 1

Here you go (codepen)

添加 HTML:

<input type='button' class='betButton' value="2"/>
<input type='button' class='betButton' value="3"/>
<input type='button' class='betButton' value="5"/>
<input type='button' class='betButton' value="50"/>

还删除了数字输入

添加了 JS(jQuery):

此代码处理点击并设置 currentBet 的值，为了清楚起见，它还向玩家的选择添加了一个名为 selected 的类

$('.betButton').click(function() {
    currentBet = $(this).val();
    $(this).addClass("selected");
    $('.betButton').not(this).removeClass("selected");
});

JS 编辑:

将引用替换为旧数字输入，并将其替换为 currrentBet...受影响的变量为:wantTo、test2 和 测试3

用

替换了旋转时用于禁用/启用输入的代码

$( ".betButton" ).prop( "disabled", true )

和

$( ".betButton" ).prop( "disabled", false )

改为禁用和启用投注按钮

添加 CSS:

input.betButton {
  border: none;
  background: white;
  color: black;
  border-radius: 5px;
  padding-left: 10px;
  padding-right: 10px;
  cursor: pointer;
}
input.betButton:disabled {
 opacity: 0.4;
}
input.betButton.selected {
  background: red;
  color: white;
  transition: 0.5s;
}