阻止表单提交刷新页面的问题

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"><meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>
Marker Animation
</title>
<style type="text/css">
html, body, #map, #form1 {
margin: 0;
padding: 0;
width: 100%;
height: 80%;
}

body, div, ul, li {
margin: 0;
padding: 0;
}
</style>

</head>
<body>
<form method="post"  id="form1">

<button id="start-animation">Start Animation</button>

<script>

var startButton = document.getElementById(‘start-animation‘);

function startAnimation() {
event.preventDefault();

}

startButton.addEventListener(‘click‘, startAnimation, false);

</script>

<form>

原文地址：https://www.cnblogs.com/zhangq/p/9082578.html

时间： 2024-10-16 17:07:44

阻止表单提交刷新页面的问题的相关文章

js阻止表单提交

<!DOCTYPE html><html><head>    <title>Simple Login Form</title>    <meta charset="UTF-8" />    <meta name="Designer" content="PremiumPixels.com">    <meta name="Author" c

js验证阻止表单提交(表单绑定onsubmit事件)

原始方式: <form action="http://www.cnblogs.com/zixueit/" onsubmit="return check()"> <input type="submit" value="提交" /> </form> <script type="text/javascript"> function check(){ if(!conf

JavaScript控制阻止表单提交

1.在表单上使用onSubmit方法 <?php $form = ActiveForm::begin([ 'options'=>[ 'class' => 'form-horizontal', 'enctype' => 'multipart/form-data', 'onSubmit'=>'return validateForm(event)', ], 'fieldConfig' => [ 'template' => '{input}{error}', 'optio

用HTTP状态码实现提交表单后刷新页面不重复提交

正常情况下,表单提交后如果用户刷新页面会重复提交表单,有些情况下我们不希望表单重复提交,利用HTTP协议中的307状态码重定向页面可以实现这个目的.实例如下: 表单页面代码: <form action="1.php" method="post"> <input type="text" name="na"> <input type="submit" value="提交&

form表单提交无页面刷新(非js)

先看一段代码(PHP例子) 1.表单代码(form.php): <?php header("Content-type: text/html; charset=utf8"); ?> <iframe name="testIframeName" style="display:none;"></iframe> <form target="testIframeName" method="

Js 阻止表单提交方法

<body>     <form action="clock.html" method="post" onsubmit="return checkLength()">         <p>name:<input type="text" name="user" id="user"></p>         <input t

From表单提交刷新？

form表单提交跳转 写作原因:   楼主的html水平一般,偶然想起周围人常说的form表单提交会刷新页面,闲来无事,就想想其中的原因   想来想去为什么会刷新,猜想了以下几条 1.先提交数据,等服务器收到数据后浏览器执行类似于F5的操作 2.同时执行数据传输,和F5 3.与服务器的设计有关 4.与浏览器的实现有关 5.协议规定必须要刷新页面 觉得这些都不合理,想了又想.... 后来想起以前做过的注册页面,数据提交到了服务器,之后后台redirect到其他页面,根本不是页面刷新,所谓的页面刷新

js阻止表单提交的两种方法

<body>     <form action="clock.html" method="post" onsubmit="return checkLength()">         <p>name:<input type="text" name="user" id="user"></p>         <input t

表单提交---前端页面模拟表单提交(form)

有些时候我们的前端页面总没有<form></form>表单,但是具体的业务时,我们又必须用表单提交才能达到我们想要的结果,LZ最近做了一些关于导出的一些功能,需要调用浏览器默认的下载功能,如果用ajax请求,则无法调用.所以只能用表单提交的方式请求后台方可调用浏览器默认的下载功能.这个时候我们只能自己手动添加<form></form>元素.这里LZ提供我自己遇到的两种情况: 一:在原有的html结构包上<form></form>标签,