Question

我正在使用jQuery-SlotMachine，特别是随机发生器。这是我的HTML：

<div id="machine1">
    <span class="option">
        <span>Example A</span>
        <span>Example B</span>
    </span>
</div>
<div id="machine2">
    <span class="option">
        <span>Example C</span>
        <span>Example D</span>
    </span>
</div>
<div id="results">
    <span></span>
</div>

这是我的js：

var machine1 = $("#machine1").slotMachine({
    active  : 0,
    delay   : 500
});

var machine2 = $("#machine2").slotMachine({
    active  : 1,
    delay   : 500,
    direction: 'down'
});

function onComplete(active){
    switch(this.element[0].id){
        case 'machine1':
            $("#machine1Result").text(this.active);
            break;
        case 'machine2':
            $("#machine2Result").text(this.active);
            break;
    }

}

$("#randomizeButton").click(function(){

    machine1.shuffle(5, onComplete);

    setTimeout(function(){
        machine2.shuffle(5, onComplete);
    }, 500);

});

所以我要做的就是在容器中吐出结果，称为“结果”。我知道this.active给了我当前元素的索引号，但我想要显示的是文本值。所以我想在内部展示“例B例C”。

我尝试过使用var $ results = $（'。active'）等东西.text（）; with $（'＃results'）。html（$ results）;但jQuery不是我的强项。

Answer 1

尝试以下方法：

 $(document).ready(function() {
  var machine1 = $("#machine1").slotMachine({
    active: 0,
    delay: 500
  });

  var machine2 = $("#machine2").slotMachine({
    active: 1,
    delay: 500,
    direction: "down"
  });

  var results;

  function onComplete(active) {
    switch (this.element[0].id) {
      case "machine1":
        $("#machine1Result").text(this.active);
        results[0] = getMachineResult($('#machine1'), this.active);
        break;
      case "machine2":
        $("#machine2Result").text(this.active);
        results[1] = getMachineResult($('#machine2'), this.active);
        break;
    }
    $("#results").text(results.join(", "));
  }

  function getMachineResult(i_jqMachine, i_iActive){
      return i_jqMachine.find('span.option > span').eq(i_iActive + 1).text();
  }

  $("#randomizeButton").click(function() {
    results = [];
    $("#results").css('color', 'white').text("");
    machine1.shuffle(5, onComplete);
    setTimeout(function() {
      machine2.shuffle(5, onComplete);
    }, 500);
  });
});

我已经初始化了一个结果数组，以便在每台机器完成时保存结果。我已经添加了一个getMachineResult例程，该例程将从机器中检索结果，因为它有＆＃34;活动＆＃34;值。然后我使用此例程将结果存储在数组中。然后，连接数组显示在#results容器中。

最后，我清除了结果数组，单击按钮时显示结果。 css('color', 'white')只是我可以看到结果。

我认为应该这样做。

在jQuery老虎机中显示活动元素的文本内容

1 个答案: