Javascript 无法使确认框工作,因为它提供了我的代码错误

Javascript 无法使确认框工作,因为它提供了我的代码错误,javascript,html,forms,function,confirmation,Javascript,Html,Forms,Function,Confirmation,我对我的确认有点问题 在我的代码中包含一个确认框之前发生的情况是,当我单击一个按钮name=preQuestion时,如果有任何验证错误,那么它将在页面上显示验证错误,而不提交表单,如果没有验证错误,那么它将提交表单 但我现在想做的是,如果有验证错误,那么它将执行当前正在执行的操作,但如果没有验证错误,那么我希望出现一个确认框,说明。。。用户将单击“确定”或“取消”。若用户单击“确定”,则提交表单;若用户单击“取消”,则关闭确认框并停留在同一页面上。我哪里做错了 下面是javascript代码,

我对我的确认有点问题

在我的代码中包含一个确认框之前发生的情况是,当我单击一个按钮name=preQuestion时,如果有任何验证错误,那么它将在页面上显示验证错误,而不提交表单,如果没有验证错误,那么它将提交表单

但我现在想做的是,如果有验证错误,那么它将执行当前正在执行的操作,但如果没有验证错误,那么我希望出现一个确认框,说明。。。用户将单击“确定”或“取消”。若用户单击“确定”,则提交表单;若用户单击“取消”,则关闭确认框并停留在同一页面上。我哪里做错了

下面是javascript代码,我缩短了代码,因此它不包含所有验证代码,否则会导致代码溢出:

function validation() {

                var isDataValid = true;

                var sessionNoO = document.getElementById("sessionNo");               
                var questionNumberO = document.getElementById("txtQuestion");
                var roomTextO = document.getElementById("room");

                var errSessionMsgO = document.getElementById("sessionNoAlert");
                var errQuesMsgO = document.getElementById("numberAlert");
                var errRoomMsgO = document.getElementById("roomAlert");

                var trimmedRoomText = roomTextO.value.replace(/^\s+/, '').replace(/\s+$/, '');



   if (sessionNoO.value == ""){
          errSessionMsgO.innerHTML = "Please Enter in the Number of Sessions you Require";
          isDataValid = false;   
    }else if (sessionNoO.value == 0){
        errSessionMsgO.innerHTML = "Number of Sessions Must be More than 0";
          isDataValid = false;
      }else{
                errSessionMsgO.innerHTML = ""; 
            }


    if(questionNumberO.value == 0){
        errQuesMsgO.innerHTML = "Please Set the Number of Questions";
        isDataValid = false;
    } else {
        errQuesMsgO.innerHTML = "";
    } 

          if (roomTextO.value == ""){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number";
          isDataValid = false;
            }else if (!trimmedRoomText.length){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number"; 
          isDataValid = false;      
        }else{
                errRoomMsgO.innerHTML = ""; 
            }

            return isDataValid;

            }

            function submitform()
            {

        var sessionFormO = document.getElementById("sessionForm");

        sessionFormO.submit();

            }

            document.getElementsByName("prequestion")[0].addEventListener('click', myClickHandler);

                function myClickHandler(){
     if(validation()){

         function showConfirm(){

         var confirmMsg=confirm("Make sure that your details are correct, once you proceed after this stage you would 
         not be able to go back and change any details towards your Session.Are you sure you want to Proceed?");

         if (confirmMsg==true)
         {
         submitform();   
         }else{
         parent.close();    
         }

     }
}
} 
<form action="QandATable.php" method="post" id="sessionForm">
          <p><strong>2: Number of Sessions you Require:</strong> <input type="text" id="sessionNo" onkeypress="return isNumberKey(event)"><br/><span id="sessionNoAlert"></span></p>
            <p><strong>8: Room:</strong> <input type="text" id="room"><br/><span id="roomAlert"></span></p>      <!-- Enter Room here-->
            <table>
            <tr>
            <th>9: Number of Questions:</th>
                <td class="spinner"><input type="text" class="spinnerQuestion" id="txtQuestion" name="textQuestion"></td>
                <td><button class="scrollBtn" id="btnQuestionUp" type="button"><img src="Images/black_uppointing_triangle.png" alt="Increase" /></button>
                <button class="scrollBtn" id="btnQuestionDown" type="button"><img src="Images/black_downpointing_triangle.png" alt="Decrease" /></button></td>
                </tr>
                </table>
                <div id="numberAlert"></div>
                <p><strong>10: </strong><input class="questionBtn" type="button" value="Prepare Questions" name="prequestion" onClick="myClickHandler()"/></p>      <!-- Prepare Questions here-->

        </form>
Html表单代码未显示整个表单,因此没有代码溢出:

function validation() {

                var isDataValid = true;

                var sessionNoO = document.getElementById("sessionNo");               
                var questionNumberO = document.getElementById("txtQuestion");
                var roomTextO = document.getElementById("room");

                var errSessionMsgO = document.getElementById("sessionNoAlert");
                var errQuesMsgO = document.getElementById("numberAlert");
                var errRoomMsgO = document.getElementById("roomAlert");

                var trimmedRoomText = roomTextO.value.replace(/^\s+/, '').replace(/\s+$/, '');



   if (sessionNoO.value == ""){
          errSessionMsgO.innerHTML = "Please Enter in the Number of Sessions you Require";
          isDataValid = false;   
    }else if (sessionNoO.value == 0){
        errSessionMsgO.innerHTML = "Number of Sessions Must be More than 0";
          isDataValid = false;
      }else{
                errSessionMsgO.innerHTML = ""; 
            }


    if(questionNumberO.value == 0){
        errQuesMsgO.innerHTML = "Please Set the Number of Questions";
        isDataValid = false;
    } else {
        errQuesMsgO.innerHTML = "";
    } 

          if (roomTextO.value == ""){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number";
          isDataValid = false;
            }else if (!trimmedRoomText.length){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number"; 
          isDataValid = false;      
        }else{
                errRoomMsgO.innerHTML = ""; 
            }

            return isDataValid;

            }

            function submitform()
            {

        var sessionFormO = document.getElementById("sessionForm");

        sessionFormO.submit();

            }

            document.getElementsByName("prequestion")[0].addEventListener('click', myClickHandler);

                function myClickHandler(){
     if(validation()){

         function showConfirm(){

         var confirmMsg=confirm("Make sure that your details are correct, once you proceed after this stage you would 
         not be able to go back and change any details towards your Session.Are you sure you want to Proceed?");

         if (confirmMsg==true)
         {
         submitform();   
         }else{
         parent.close();    
         }

     }
}
} 
<form action="QandATable.php" method="post" id="sessionForm">
          <p><strong>2: Number of Sessions you Require:</strong> <input type="text" id="sessionNo" onkeypress="return isNumberKey(event)"><br/><span id="sessionNoAlert"></span></p>
            <p><strong>8: Room:</strong> <input type="text" id="room"><br/><span id="roomAlert"></span></p>      <!-- Enter Room here-->
            <table>
            <tr>
            <th>9: Number of Questions:</th>
                <td class="spinner"><input type="text" class="spinnerQuestion" id="txtQuestion" name="textQuestion"></td>
                <td><button class="scrollBtn" id="btnQuestionUp" type="button"><img src="Images/black_uppointing_triangle.png" alt="Increase" /></button>
                <button class="scrollBtn" id="btnQuestionDown" type="button"><img src="Images/black_downpointing_triangle.png" alt="Decrease" /></button></td>
                </tr>
                </table>
                <div id="numberAlert"></div>
                <p><strong>10: </strong><input class="questionBtn" type="button" value="Prepare Questions" name="prequestion" onClick="myClickHandler()"/></p>      <!-- Prepare Questions here-->

        </form>

我已经纠正了你的代码,现在它的工作良好检查出来 功能验证{

                var isDataValid = true;

                var sessionNoO = document.getElementById("sessionNo");               
                var questionNumberO = document.getElementById("txtQuestion");
                var roomTextO = document.getElementById("room");

                var errSessionMsgO = document.getElementById("sessionNoAlert");
                var errQuesMsgO = document.getElementById("numberAlert");
                var errRoomMsgO = document.getElementById("roomAlert");

                var trimmedRoomText = roomTextO.value.replace(/^\s+/, '').replace(/\s+$/, '');



   if (sessionNoO.value == ""){
          errSessionMsgO.innerHTML = "Please Enter in the Number of Sessions you Require";
          isDataValid = false;   
    }else if (sessionNoO.value == 0){
        errSessionMsgO.innerHTML = "Number of Sessions Must be More than 0";
          isDataValid = false;
      }else{
                errSessionMsgO.innerHTML = ""; 
            }


    if(questionNumberO.value == 0){
        errQuesMsgO.innerHTML = "Please Set the Number of Questions";
        isDataValid = false;
    } else {
        errQuesMsgO.innerHTML = "";
    } 

          if (roomTextO.value == ""){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number";
          isDataValid = false;
            }else if (!trimmedRoomText.length){
          errRoomMsgO.innerHTML = "Please Enter in a Room Number"; 
          isDataValid = false;      
        }else{
                errRoomMsgO.innerHTML = ""; 
            }

            return isDataValid;

            }

            function submitform()
            {

        var sessionFormO = document.getElementById("sessionForm");

        sessionFormO.submit();

            }

            document.getElementsByName("prequestion")[0].addEventListener('click', myClickHandler);

    // problem was here             
function myClickHandler()
{
     if(validation())
{
showConfirm();


     }
}


 function showConfirm(){

         var confirmMsg=confirm("Make sure that your details are correct, once you proceed after this stage you would not be able to go back and change any details towards your Session.Are you sure you want to Proceed? ");

         if (confirmMsg==true)
         {
         submitform();   
         }else{
         parent.close();    
         }
}

找不到myClickHandler方法定义??为什么不在单击时直接调用验证?因为我希望按钮进行验证,然后显示确认框,然后提交表单,因此最好创建一个函数,从所有3个函数中检索信息,然后再包括showConfirm函数myClickHandler性能良好ctlyNo问题我喜欢这个问题并纠正了它,现在就检查它,效果很好。我可以问一个小问题吗,当我单击“确定”或“取消”时,它会关闭确认框,然后再次打开,问同样的问题,如果我第二次单击“确定”或“取消”,它会关闭确认框,这是为什么?