我怎样才能延迟提交

Question

我怎样才能延迟提交直到音频文件完成，因为当提交事件触发时页面刷新而不播放声音文件我已经试过了，但没有用。

<form action="/game1/" method="POST" onsubmit="checkAnswer()">
        {% csrf_token %}
        <input type="hidden" name="UserSorce" id="us" >
        <button type="submit" class="btn btn-primary btn-circle btn-xl">
          Check
        </button>
      </form>

function checkAnswer()
  {
    let tmp=document.getElementById("answer").innerText;
    if(correctAns==tmp)
    { 
        document.getElementById("result").src=picCorrect;
        document.getElementById("result").style.display="block";
        var audio = new Audio(soundCorrect);
        audio.play();
        audio.onended = function () {
          return true;
        }
    }else{
        document.getElementById("result").src=picIncorrect;
        document.getElementById("result").style.display="block";
        var audio = new Audio(soundIncorrect);
        audio.play();  
    }
  }

Answer 1

您好，请尝试处理提交事件的 preventDefault：

function checkAnswer(e)
  {

    e.preventDefault();

    let tmp=document.getElementById("answer").innerText;
    if(correctAns==tmp)
    { 
        document.getElementById("result").src=picCorrect;
        document.getElementById("result").style.display="block";
        var audio = new Audio(soundCorrect);
        audio.play();
        audio.onended = function () {
          return true;
        }
    }else{
        document.getElementById("result").src=picIncorrect;
        document.getElementById("result").style.display="block";
        var audio = new Audio(soundIncorrect);
        audio.play();  
    }
  }

Answer 2

您几乎已经准备好了所有需要的东西。这里的技巧是不要使用表单的提交按钮触发提交。而是添加一个简单的 html 按钮，它调用 checkAnswer().

在 checkAnswer() 函数中，您已经在监听音频的 onended 事件。如果发生这种情况，您最终可以使用它的 submit() 功能提交表单。

有点像这样：

<form id="myForm" action="/game1/" method="POST">
  <input type="hidden" name="UserSorce" id="us">
</form>
<button onclick="checkAnswer()">
  Check
</button>

和

function checkAnswer() {
  let tmp = document.getElementById("answer").innerText;
  if (correctAns == tmp) {
    document.getElementById("result").src = picCorrect;
    document.getElementById("result").style.display = "block";
    var audio = new Audio(soundCorrect);
    audio.onended = function() {
      document.getElementById("myForm").submit();
    }
    audio.play();

  } else {
    document.getElementById("result").src = picIncorrect;
    document.getElementById("result").style.display = "block";
    var audio = new Audio(soundIncorrect);
    audio.play();
  }
}

我怎样才能延迟提交

How can I delay submit

javascript

html

submit