Question

我正在尝试使用HTML和JS创建基本的问题游戏。有一个问题有三个可能的答案。如果用户选择了正确的答案，他会获得一分并提醒答案是正确的。如果用户选择了错误的答案，他会收到答案不正确的警报。我设法根据选择的内容正确获取警报。但我不能让计数器增加（它总是保持为0）。没有想法可以解决问题，所以我在这里寻求帮助。

＆＃13;

var rez = ivertinimas(); 
var suTaskai = "Rezultatas: " + rez;
document.getElementById("rezultatas").innerHTML = suTaskai;
function ivertinimas() {
  var taskai = 0;
  var radios = document.getElementsByName("kalnas");
  for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
      var ats = radios[i].value;
        if (ats === "k2") {
          alert("Atsakymas teisingas!");
          taskai++;
        }
        else {
            alert("Atsakymas neteisingas. Teisingas atsakymas yra K2.")
        }
     break;
    }
  }
    return taskai;
}

＆＃13;

<div>
  <h1 id="title">Klausimų žaidimas</h1>
  <h3>Už kiekveiną teisingą atsakymą duodamas vienas taškas.</h3>
  <h3 id="rezultatas"></h3>
  <h4>Koks yra antras pagal aukštį kalnas pasaulyje?</h4>
  <form id="klausimai" onsubmit="ivertinimas()">
    <input type="radio" name="kalnas" value="everestas">Everestas<br>
    <input type="radio" name="kalnas" value="k2">K2<br>
    <input type="radio" name="kalnas" value="leipkalnis">Liepkalnis<br>
    <input type="submit" value="Pateikti atsakymą">
  </form>
</div>

＆＃13;

Answer 1

var taskai必须是全局的

    var rez = ivertinimas(); 
var suTaskai = "Rezultatas: " + rez;
var taskai
document.getElementById("rezultatas").innerHTML = suTaskai;
function ivertinimas() {
var radios = document.getElementsByName("kalnas");
for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
    var ats = radios[i].value;
        if (ats === "k2") {
        alert("Atsakymas teisingas!");
        taskai++;
        }
        else {
            alert("Atsakymas neteisingas. Teisingas atsakymas yra K2.")
        }
    break;
    }
}
    return taskai;
}

Answer 2

这是一个工作示例（必须删除表单，以便我可以显示计数器上升）

＆＃13;

var taskai = 0;
var rez = ivertinimas(); 
var suTaskai = "Rezultatas: " + rez;
document.getElementById("rezultatas").innerHTML = suTaskai;
function ivertinimas() {
  
  var radios = document.getElementsByName("kalnas");
  for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
      var ats = radios[i].value;
        if (ats === "k2") {
          alert("Atsakymas teisingas!");
          taskai++;
          var somevar = "Rezultatas: " + taskai;
          document.getElementById("rezultatas").innerHTML = somevar;
        }
        else {
            alert("Atsakymas neteisingas. Teisingas atsakymas yra K2.")
        }
     break;
    }
  }
    return taskai;
}

＆＃13;

<div>
  <h1 id="title">Klausimų žaidimas</h1>
  <h3>Už kiekveiną teisingą atsakymą duodamas vienas taškas.</h3>
  <h3 id="rezultatas"></h3>
  <h4>Koks yra antras pagal aukštį kalnas pasaulyje?</h4>
  
    <input type="radio" name="kalnas" value="everestas">Everestas<br>
    <input type="radio" name="kalnas" value="k2">K2<br>
    <input type="radio" name="kalnas" value="leipkalnis">Liepkalnis<br>
    <input type="submit" onclick="ivertinimas()" value="Pateikti atsakymą">
  
</div>

＆＃13;

我所做的只是将计数器放在函数之外，并在HTML上添加结果的动态更新。希望这有帮助！

Answer 3

计数器必须是全局的，并且onsubmit不应该触发函数的执行。

let taskai = 0;

function update(counter) {
  var suTaskai = "Rezultatas: " + counter;
  document.getElementById("rezultatas").innerHTML = suTaskai;
}

function ivertinimas() {
  var radios = document.getElementsByName("kalnas");
  for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
      var ats = radios[i].value;
      if (ats === "k2") {
        //alert("Atsakymas teisingas!");
        update(++taskai);
      } else {
        alert("Atsakymas neteisingas. Teisingas atsakymas yra K2.")
      }
      break;
    }
  }
  return false;
}

<div>
  <h1 id="title">Klausimų žaidimas</h1>
  <h3>Už kiekveiną teisingą atsakymą duodamas vienas taškas.</h3>
  <h3 id="rezultatas"></h3>
  <h4>Koks yra antras pagal aukštį kalnas pasaulyje?</h4>
  <form id="klausimai">
    <input type="radio" name="kalnas" value="everestas">Everestas<br>
    <input type="radio" name="kalnas" value="k2">K2<br>
    <input type="radio" name="kalnas" value="leipkalnis">Liepkalnis<br>
    <input type="submit" value="Pateikti atsakymą" onclick="ivertinimas(); return false">
  </form>
</div>

Answer 4

对于您的问题，这是一个快速而糟糕的解决方案。

var rez = 0
var suTaskai = 'Rezultatas: <span id="result"></span>';
document.getElementById("rezultatas").innerHTML = suTaskai;
document.getElementById("result").innerHTML = rez;
var button = document.getElementById("button");
button.onclick = function ivertinimas() {
  var taskai = +document.getElementById("result").innerHTML;
  var radios = document.getElementsByName("kalnas");
  for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
      var ats = radios[i].value;
      if (ats === "k2") {
        alert("Atsakymas teisingas!");
        taskai++;
      } else {
        alert("Atsakymas neteisingas. Teisingas atsakymas yra K2.")
      }
      break;
    }
  }
  document.getElementById("result").innerHTML = taskai;
}

<div>
  <h1 id="title">Klausimų žaidimas</h1>
  <h3>Už kiekveiną teisingą atsakymą duodamas vienas taškas.</h3>
  <h3 id="rezultatas"><span id="result"></span></h3>
  <h4>Koks yra antras pagal aukštį kalnas pasaulyje?</h4>
  <div id="klausimai">
    <input type="radio" name="kalnas" value="everestas">Everestas<br>
    <input type="radio" name="kalnas" value="k2">K2<br>
    <input type="radio" name="kalnas" value="leipkalnis">Liepkalnis<br>
    <button id="button" onclick="ivertinimas()">Pateikti atsakymą</button>
  </div>
</div>

Answer 5

你应该在函数之外定义你的var taskai = 0;，你正在打电话。但请注意，定义全局变量并不总是一个好主意。

有关详细信息，请参阅：https://gist.github.com/hallettj/64478

JavaScript单选按钮得分计数器

5 个答案: