-
2021-06-10 16:56:27
type=button 就单纯是按钮功能 type=submit 是发送表单 但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性: 使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一.用button后往往页面不支持enter键了。所
type=button 就单纯是按钮功能
type=submit 是发送表单
但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性:
使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一.用button后往往页面不支持enter键了。所以需要支持enter键,必须要设置个submit,默认enter键对页面第一个submit进行操作。
==========================
执行完onClick,转到action。可以自动提交不需要onClick。所以说onclick这里可以不要。
执行完onClick,跳转文件在 js文件里控制。提交需要onClick。比如:1,οnclick="form1.action='a.jsp';form1.submit();" 这样就实现了submit的功能了。2,
3,js实现页面跳转的几种方式:第一种:
window.location.href="login.jsp?backurl="+window.location.href;
第二种:
alert("返回");
window.history.back(-1);
第三种:
window.navigate("top.jsp");
第四种:
self.location='top.htm';
第五种:
alert("非法访问!");
top.location='xx.jsp';
http://hi.baidu.com/liliuqing/blog/item/e0b9e22cc4613fe88b13994a.html
更多相关内容 -
html页面点击按钮实现页面跳转
2022-04-28 20:20:18方法1、在button标签外嵌套一个a标签,利用超链接进行跳转;...方法2、在button标签中添加οnclick="window.location.href=‘页面url’"代码,使用onclick事件进行跳转。 <button onclick="window.location.href方法1、在button标签外嵌套一个a标签,利用超链接进行跳转;
<a href="https://www.baidu.com/" target="_blank"> <button>进入baidu首页</button> </a>
方法2、在button标签中添加οnclick="window.location.href=‘页面url’"代码,使用onclick事件进行跳转。
<button onclick="window.location.href = 'https://www.baidu.com/' target="_blank"">进入baidu首页</button>
-
HTML点击按钮button跳转页面的几种实现方法
2019-11-20 16:30:09button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button> 方法一:在button标签中加上onclick属性,赋值为Javascript <input type="button" name=...其实我比较喜欢第一种方法
<button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button>
正文
方法一:在button标签中加上onclick属性,赋值为Javascript
<input type="button" onclick='location.href=("index.aspx")' />//在本页面打开 <input type="button" onclick='window.open("bedzhao.aspx")' />//打开新页面 <button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button>
方法二:触发一个函数跳转
<script> function jump(){ window.location.href="http://blog.sina.com.cn/mleavs"; } </script> <input type="button" value="我是一个按钮" οnclick=javascript:jump()>
方法三:a标签的超链接可以直接嵌套一个button
<a href="https://www.baidu.com/"> <button>点我跳转到度娘!</button> </a>
方法四:表单的action定向提交跳转
<from action="xx.html" method="post"> <input type="bottom" value="按钮"> </from>
还有其他方法,有些方法一些浏览器可能会不支持。
结尾
我是圆圆,如果我的文章对你的学习成长有所帮助,欢迎 点 赞 👍 支持,您的 点 赞 👍 支持是我进行创作和分享的动力!
如果有问题可以留言评论或者私信我,我都会一一解答~笔芯🤞
参考
- https://blog.csdn.net/tjh625/article/details/81235827
- https://blog.csdn.net/weixin_44025103/article/details/90017593
-
js点击button按钮跳转到另一个新页面
2020-10-25 09:33:00点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么做到呢?可以使用onclick=[removed]=新页面来实现 -
提交表单后跳转到想要的页面--jQuery form
2021-06-11 05:58:26表单提交的问题一直困扰着我这个新手,现在也算学习了不少,解决了我现在有的问题 —— 提交了表单之后将数据给到后台并且让前端页面跳转到想要的页面或出现想要的内容。用到了 jQuery Form Plugin,表单提交的第三...表单提交的问题一直困扰着我这个新手,现在也算学习了不少,解决了我现在有的问题 —— 提交了表单之后将数据给到后台并且让前端页面跳转到想要的页面或出现想要的内容。
用到了 jQuery Form Plugin,表单提交的第三方插件,为了更方便的管理和提交表单。(官网:http://plugins.jquery.com/form/)
借鉴:https://blog..net/m0_37505854/article/details/79639046(主要)
https://www..com/hudandan/p/5912336.html
我在这只写如何提交并显示想要的内容(跳转到页面同理),其中有好多概念什么的,我没列举出来,不了解的可以先看一遍官网的文档或其他的相关文档,有个大概的了解之后再去参考别人写的代码,就会好理解很多,我就是这样做的。
1 引入 jQuery.js 和 jquery-form.js:
2 HTML 里写的代码就是很普通的表单控件:
提交
3 js 代码:
重点就是 js 代码的部分了,这是实现表单提交之后的显示的!
$( //页面加载完执行
$("#ajaxForm").on("submit",function () { //表单提交时监听提交事件
$(this).ajaxSubmit(options); //当前表单执行异步提交,optons 是配置提交时、提交后的相关选项
return false; // 必须返回false,才能跳到想要的页面
})
)
//配置 options 选项
var options = {
url: "/postform", //提交地址:默认是form的action,如果申明,则会覆盖
type: "post", //默认是form的method(get or post),如果申明,则会覆盖
success: successFun, //提交成功后的回调函数,即成功后可以定页面跳到哪里
dataType: "json", //接受服务端返回的类型
clearForm: true, //成功提交后,清除所有表单元素的值
resetForm: true, //成功提交后,重置所有表单元素的值
timeout: 3000 //设置请求时间,超过该时间后,自动退出请求,单位(毫秒)
}
//设置提交成功后返回的页面
function successFun(data,status) {
$("#showForm").html(data.msg); //提交表单后从后台接收到的返回来的数据,我保存到了msg里
// $("#showForm").html("或者这里可以直接写想要显示的内容")
}
我用的是 nodejs (非必须):
app.post("/postform",function (req, res) {
console.log(req.body);
userLink.create({
"name": req.body.user,
"age": req.body.age
},function (err) {
if(err) throw err;
res.status(200).json({success: true,msg: "提交成功,这是你想要返回的页面。"});
})
})
其实写 nodejs 是因为要给一个可以提交过去的地址,一般都是后台给的,为了记录就写上了。
有不足之处欢迎指正,共同学习。
(⌒▽⌒)
-
from表单多个按钮提交用onclick跳转不同action
2020-12-12 13:47:53//下面input框提交的action不同,用onclick跳转,写一个js方法 <input type=”button” class=”mulButton” name=”Ids” id=”allcheck” onclick=”manySend(‘ad/BusinessAction!sendmany.action’)” value... -
html只提交表单而不跳转页面
2022-04-14 09:01:48form的action属性是提交数据的url地址,向servlet提交数据的时候,当前页面会跳转到servlet,但如果想在当前页面连续多次提交,那么就希望提交数据后页面不会进行跳转。 解决方法: 在html中添加一个隐藏的iframe,... -
asp点击按钮跳转页面 ASP中按钮的点击触发网页跳转
2021-06-10 16:20:27ASP中按钮的点击触发网页跳转asp中要实现点击一个按钮转到另一个网页有几种方法就是按下一个BUTTON,转到另一个网页,一共有哪些方式实现? 我只知道ona标签,背景图按钮,直接点击跳转链接href="xxx.asp"asp 中怎么... -
js 按钮实现跳转页面 jsp html
2020-12-22 10:35:05type=button就单纯是按钮功能type=submit是发送表单但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性:使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一.... -
HTML-跳转按钮(点击一个按钮跳转到新的页面)
2018-01-26 14:52:49<button onclick="tz()">跳转</button> <script> function tz(){ window.location.href='目标网址'; } </script> -
关于HTML按钮跳转方法(及其相关)
2021-02-03 09:27:04html 跳转问题(及其相关) 方法一 <a href="javascript:" onclick="history.go(-2); ">返回前两页</a> 方法二 <a href="javascript:" onclick="self.location=document.referrer;">返回上一页并... -
如何实现表单内的按钮点击不跳转页面并且提交表单
2021-08-02 22:12:27如何实现表单内的按钮点击不跳转页面并且提交表单 方法一:使button标签点击后无法提交表单内容,用iframe实现页面不跳转 用onclick=“”返回false使button的点击提交失效 源代码如下 Html: <form method="" ... -
jQuery点击按钮跳转页面
2021-02-27 16:48:36<div class="mui-button"> <button id="code" type="button" >.../button> </div>... $('#code').on('click',function(){ ...按钮如果不设置type类型,则默认type类型为submit 提交 在htm -
HTML点击图片实现提交或跳转链接页面
2021-04-06 22:05:02点击图片提交 提交后实现跳转,但需要注意的是;鼠标光标放在图片上,显示的还是箭头(没有改变)。 .css input{ width: 400px; height: 400px;... border: 3px solid blue;...-- 按钮跳转 --> 图片按钮跳转 &l -
html中Form表单提交时页面不跳转的方法详解
2021-03-23 19:29:591.1 解决方案一表单action提交数据,但页面不跳转,可以使用Iframe解决。实例:Form提交表单页面不跳转账户:密码:注意:Form元素的target属性一定是指定要显示返回结果的iframe元素的name属性。Iframe元素可以放到... -
html js点击按钮滚动跳转定位到页面指定位置(DIV)的方法代码
2021-06-11 11:18:58一:通过html锚点实现滚动定位到页面指定位置(DIV):如果我们要点击实现...通过点击button按钮使用js实现滚定跳转到页面指定位置(DIV):如果我们要点击实现跳转的地方是一个button按钮的话,由于button不能添加href... -
ajax如何实现页面局部跳转与结果返回
2020-11-23 01:32:51这里用一个提交按钮来演示,HTML代码为: <input type="button" class="btn" value="提报" name="submit4" onClick="tibao();"> 点击提报按钮后,通过ajax来实现跳转到action中处理,JavaScript代码为: ... -
html点击按钮跳转到另一个界面_网页制作:一个简易美观的登录界面
2020-11-02 22:58:34效果图目录结构:在我们做一个页面之前,要先想好他的一个整体布局,也就是我们这里面的login.html主页面,大致结构如下:接下来,我们先上代码,看一下具体实现方法:login.html<!DOCTYPE html> <html ... -
如何实现在提交表单之后跳转到指定页面
2021-08-14 19:55:50function check(){ ... document.formname.submit(); window.location.href="URL" //如何使该句能够执行,或者怎样写是正确的? } ... <form name="formname" action="fun.js" method="post">... -
form表单submit按钮提交页面不跳转
2018-06-11 12:23:00方案一 <html> <body> <form action="" method="post" target="nm_iframe"> <input type="text" id="id_input_text" name="nm_input_text" /... -
vue 解决form表单提交但不跳转页面的问题
2021-06-14 05:13:09vue 解决form表单提交但不跳转页面的问题vue使用@submit.prevent=""来设置提交时执行的函数,并阻止页面跳转:sub函数写在methods内:methods:{$.post('http://api.test.ai/visitorinfo/', $('#msgForm').serialize... -
5秒钟之后跳转页面(点击按钮直接跳转)
2021-09-20 21:02:39文章目录前言一、5秒钟之后跳转页面(点击按钮直接跳转) 前言 一些javascript的小功能的实现 提示:以下是本篇文章正文内容,下面案例可供参考 一、5秒钟之后跳转页面(点击按钮直接跳转) <!DOCTYPE html>... -
出现一个问题,点击“注册”按钮页面进入注册表单后自动跳转回登录页面
2021-06-13 09:12:53源自:4-5 单页面应用Demo2(2)出现一个问题,点击“注册”按钮页面进入注册表单后自动跳转回登录页面用户名:密码:登录注册用户名:密码:再次输入密码:确定取消exportdefault{name:"Login",data(){return{isReg:... -
前端-html 点击 跳转页面
2019-07-18 21:50:17html 点击 跳转页面 第一种: 在 button 标签加上 onclick 属性,使用 window.location.href='url' 进行跳转 <input type="button" name="register" value="注册" onclick="window.location.href='register.jsp'... -
jsp中用按钮来跳转页面并传递参数
2020-06-30 03:47:03跳转页面并传递参数 <form action="DemoServlet" method="post"> /*传递到我设置的DemoServlet类中*/ <input type="hidden" name="account" value="###"> /*这里采用hidden形式传递a -
Submit提交表单后无法跳转页面
2020-07-06 11:37:32问题描述: 在做登录界面,因为要用到validform验证,所以需要对表单进行提交,但...这个页面的跳转。 $(".stu_login_error").Validform({ tiptype:function(msg,o,cssctl){ var objtip=$(".stu_error_box"); cs -
flask如何实现点击按钮后不跳转页面
2020-06-05 13:49:12我想实现点击按钮后只执行后台代码,不跳转或刷新页面,return render_template('')这一行我应该如何写? ``` app = Flask(__name__) @app.route('/', methods=["GET", "POST"]) def ws_test(): if request.... -
一个表单元素俩个按钮跳转不同页面
2020-04-01 16:07:03一个表单元素俩个按钮跳转不同页面 图片如上: 红色箭头是用超链接a元素实现的,设置href属性跳转页面 黄色箭头是用javascript实现修改form表单元素的action属性实现跳转,可以达到一个form跳转俩个页面的效果。 &...