Js确认如果取消刷新页面

js confirm refreshes page if cancelled

本文关键字:刷新 取消 确认 如果 Js      更新时间:2023-09-26

所以我有一个表单,当提交时需要确认。我使用Javascript确认来提示这一点。但是,如果有人点击取消,我不希望它刷新。我以为放一个空的else语句会这样做,但似乎我错了。

不确定我需要做什么,以确保它不会刷新,如果有人按下取消弹出。

JS确认代码
function postConfirm() {
   if (confirm('You will not have another chance after submitting to view your post. Please make sure it is exactly how you want it before continuing. ')) {
       yourformelement.submit();
   } else {
   }
}

使用这个JS函数的表单(如果需要)

<div id="uploadForm">
        <center>
          <form enctype="multipart/form-data" action="functions/post_upload.php" method="post">
            <input type="hidden" name="MAX_FILE_SIZE" value="99999999" />
            <div><textarea id="text" cols="70" rows="15" name="entry"></textarea></div>
            <p> Attach an image to this memory!</p>
            <input name="userfile" type="file"><br>
            <input type="submit" value="Submit" class="blueButton" onclick="postConfirm()"/></div>
          </form></center>
        </div>

变化:

onclick="postConfirm()"

onclick="return postConfirm()"

,在你的函数中,使用else:

else {
    return false;
   }
<<p> jsFiddle例子/strong>

尝试添加

return false;

到if语句的else部分。

编辑:

还要修改对该函数的调用,以便将返回false传递回提交操作(该操作在单击按钮时触发)。

<input type="submit" value="Submit" class="blueButton" onclick="return postConfirm()"/></div>

您可以使用事件对象的preventDefault()方法阻止表单提交,并使用表单元素的submit()方法在确认后手动提交表单。

HTML更改为:

<input type="submit" value="Submit" class="blueButton" onclick="postConfirm(event)"/></div>
function postConfirm(e) {
  e.preventDefault();
  if(confirm('You will not have another chance after submitting to view your post. Please make sure it is exactly how you want it before continuing. ')) 
   yourformelement.submit();
}

然而,最好避免内联javascript,因为它被认为是一种不好的做法。你可以这样做:
var button = document.getElementsByClassName("blueButton")[0];
button.addEventListener("click",function(e) {
  e.preventDefault();
  if(confirm('You will not have another chance after submitting to view your post. Please make sure it is exactly how you want it before continuing. ')) 
   yourformelement.submit();
});

try

<input type="button" value="Submit" class="blueButton" onclick="postConfirm()"/></div>
不是

<input type="submit" value="Submit" class="blueButton" onclick="postConfirm()"/></div>