调用一个Java脚本方法并阻止表单提交

Question

 <form id=orders name="orders" action="orders_action.php" method="post" enctype="multipart/form-data" onsubmit="onTimeChange();
  ">

在这里，当表单提交时，如果时间在正确的范围内，它应该成功提交，如果它不在正确的范围内，应该使用alert box(already done by using onTimeChange() function)给出警告消息。我面临的问题是，即使出现警告框，我按下"OK"按钮，表单数据被提交到数据库中!我怎样才能预防呢?

 var input =  document.getElementById('time');
                        function onTimeChange() {

                            var minTime = input.min;
                            var maxTime = input.max
                            var value = input.value + ':00'
                            console.log(minTime,maxTime,value);
                            if(minTime > value ||  value > maxTime) {
                                alert('Pharmacy is opened only between 8AM and 4PM!')
                            }
                            else{
                            return false;
                            }
                        }

这是onTimeChange()

Answer 1

你必须在提交事件中使用'preventDefault'方法。

function onTimeChange(event) {
   var minTime = input.min;
   var maxTime = input.max
   var value = input.value + ':00'
   console.log(minTime,maxTime,value);
   if (minTime > value ||  value > maxTime) {
       alert('Pharmacy is opened only between 8AM and 4PM!')
   } else {
     event.preventDefault();
   }
}

Answer 2

你可以这样试试

    <form id=orders name="orders" action="orders_action.php" method="post" 
enctype="multipart/form-data" onsubmit="return onTimeChange();">
      function onTimeChange() {

                            var minTime = input.min;
                            var maxTime = input.max
                            var value = input.value + ':00'
                            console.log(minTime,maxTime,value);
                            if(minTime > value ||  value > maxTime) {
                                alert('Pharmacy is opened only between 8AM and 4PM!');
                               return false;
                            }
                            else{
                            return true;
                            }
                        }