视频，然后在html格式视频

video, form then video in html

本文关键字：视频 格式 html 然后      更新时间：2023-09-26

我可以播放一个视频剪辑，检测视频结束后创建一个窗体，然后播放另一个视频剪辑。我的问题是，表单没有正确的反应，我已经创建了一个提交按钮和两个单选按钮来选择的表单。我希望让用户做一个选择，验证响应，然后加载下一个剪辑。但是查看表单的唯一方法是使用警告消息。代码:

function makeForm(){
    var mypara=document.getElementById("miArea");
    var myform =document.createElement("form");
    myform.id="miid";
    myform.name='registration' ;
    myform.setAttribute("onSubmit","formValidation()");
    var x = document.createElement("INPUT");
    var y = document.createElement("INPUT");
    var z= document.createElement("INPUT");
    var s = document.createElement("br");
    var s1 = document.createElement("br");
    x.setAttribute("type", "radio");
    x.setAttribute ("name","huevos");
    y.setAttribute("type", "radio");
    y.setAttribute ("name","huevos");
    z.setAttribute("type", "button");
    z.setAttribute("value","Submit")
    z.setAttribute("onclick", "formValidation()")
    x.value="revueltos";
    y.value="estrellados";
    //submit button
    var contenido1 = document.createTextNode("Revueltos");
    var contenido2 = document.createTextNode("Estrellados ");
    myform.appendChild(contenido1);
    myform.appendChild(x);
    myform.appendChild (s);
    myform.appendChild(contenido2);
    myform.appendChild(y);
    myform.appendChild(s1);
    myform.appendChild(z);
    mypara.appendChild(myform);
    alert ("antes de crear la forma9");}
function videoEnded(){
    deleteVideo();
    makeForm();
    deleteForm();
    loadVideo();
}
function deleteForm() {
    mform=document.getElementById("miid");
    mform.parentNode.removeChild(mform);
}
/*onEnded is called once the first video ends.
this is the body part*/
<body>
    <p id="miArea">
        <video width="640" height="480" src="reglamento1.mp4" id="video" controls onended="videoEnded()">
            video not supported
        </video>
    </p>
</body>

希望你能帮助我。

您的代码

deleteVideo();
makeForm();
deleteForm();
loadVideo();

删除视频，创建表单，然后立即销毁它(并再次加载视频)。

我认为您希望在按Submit按钮时执行deleteForm();loadVideo();部分。

在Submit按钮的onclick属性中，你可以调用一个函数来完成这个操作。

function buttonClick(){
    deleteForm();
    loadVideo();
}

两个问题。

  1. 在调用所有函数之前必须完整地定义它们。
    2. 你必须插入myForm元素到文档对象模型(DOM)

这是一个jsfield: 

<script>
function endOfVideo(){
    deleteVideo();
    makeForm();
   // deleteForm();
  //  loadVideo();
}
function makeForm(){
    var mypara=document.getElementById("miArea");
    var myform =document.createElement("form");
    myform.id="miid";
    myform.name='registration' ;
    myform.setAttribute("onSubmit","formValidation()");
    var x = document.createElement("INPUT");
    var y = document.createElement("INPUT");
    var z= document.createElement("INPUT");
    var s = document.createElement("br");
    var s1 = document.createElement("br");
    x.setAttribute("type", "radio");
    x.setAttribute ("name","huevos");
    y.setAttribute("type", "radio");
    y.setAttribute ("name","huevos");
    z.setAttribute("type", "button");
    z.setAttribute("value","Submit")
    z.setAttribute("onclick", "formValidation()")
    x.value="revueltos";
    y.value="estrellados";
    //submit button
    var contenido1 = document.createTextNode("Revueltos");
    var contenido2 = document.createTextNode("Estrellados ");
    myform.appendChild(contenido1);
    myform.appendChild(x);
    myform.appendChild (s);
    myform.appendChild(contenido2);
    myform.appendChild(y);
    myform.appendChild(s1);
    myform.appendChild(z);
    mypara.appendChild(myform);
    // alert ("antes de crear la forma9");
    document.body.insertBefore(myform, mypara); 
}
function deleteVideo(){
    var firstVideo = document.getElementById('video');
    firstVideo.parentNode.removeChild(firstVideo);
}
function deleteForm() {
    mform=document.getElementById("miid");
    mform.parentNode.removeChild(mform);
}
</script>
相关文章：