javascript button 提交

最新推荐文章于 2024-07-07 20:19:55 发布
原创 最新推荐文章于 2024-07-07 20:19:55 发布 · 2.4k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #button #input #html #function #文档

本文介绍了一个简单的HTML页面使用JavaScript实现表单按钮点击后进行页面跳转的功能。通过两个按钮触发不同页面路径的切换，展示了基本的前端交互方式。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript">
function seta(test){
    var a=test;
    if(a=='1'){
        f1.action='1.htm';
        document.getElementById("f1").submit()

    }
    if(a=='2'){
        f1.action='2.htm';
        document.getElementById("f1").submit()
    }
}


</script>

<body>
<form name="f1">
<input type=button value="submit1" onclick="seta(1)"/>
<input type=button value="submit2" onclick="seta(2)"/>
</form>
</body>
</html>
 
JS button按钮实现submit按钮提交效果
10-21
今天在使用表单是同时使用POST更新、删除操作。然而form表单的 submit 且一旦提交则全部提交，所以想到的实现方法就是 使用button实现,怎么实现呢？下面小编给大家分享JS button按钮实现submit按钮提交效果，感兴趣的朋友参考下吧
js控制提交按钮
bakelFF的博客
10-29 1202
实现效果：当两次输入的密码不正确时，禁用提交按钮 html/scc代码: js代码: ​ <script type="text/javascript"> // var flag = false; //确认密码 function fun2(){ var pw = document.getElementById("pw"); var repw = document.getElementById("repw"); var btn1 = document.getElementById(..
关于js 提交按钮的问题
fangzi_183的专栏
06-05 1903
name不能用zhuce因为这样会与js方法名发生冲突 －－－ 至于为什么不能验证，在于一个思路和语法问题 你写成 type=submit 时 只要你一点这个控件 form就提交了，所以onclick事件不会影响form的提交，验证方法自然也就无效了 提供两个解决方法 1. 把type改在button 这样在点“注册时”就不会自动提交 但是在function zhuce中的验证成功时提交for
js做的提交按钮
qq_42754261的博客
07-08 2188
<script> $.post("/news2/ContentTItle","id="+1,callBack,"html"); function callBack(data){ $("#header").append(data); } $(function (){ $('#area').blur(function (){ $("#area").removeC...
js提交button
八点二十四分
12-13 1062
&lt;button type="button" class="w100p let-space js-submit" id="btn"&gt;提交&lt;/button&gt; var oBtn = document.getElementById('btn'); oBtn.onclick = function(){ var mobile=$("#mobile").val()
JavaScript在form表单中使用button按钮实现submit提交方法
01-19
submit是button的一个特例，也是button的一种，它把提交这个动作...使用button按钮实现submit提交，需要在button标签中的使用onclick方法，然后在JavaScript中实现具体，代码如下： <head> [removed] functio
javascript实现点击提交按钮后显示loading的方法
10-23
主要介绍了javascript实现点击提交按钮后显示loading的方法,涉及javascript动态设置页面元素样式的相关技巧,需要的朋友可以参考下
用image来提交form不想使用button提交form
12-13
通常，我们使用`<button>`或`<input type="submit">`标签来创建一个提交按钮，但有时为了美观，开发者可能会选择使用图像（image）作为提交按钮。本文将详细讲解如何使用图像提交表单，以及解决可能出现的重复提交...
javascript实现表单提交后，提交按钮不可用的方法
10-24
本文主要介绍在使用JavaScript进行网页开发时，如何在表单提交后禁用提交按钮，以及相关的动态修改表单样式的技巧。 首先，我们需要理解HTML表单（form）和按钮（button/input）的基本结构。在HTML中，表单由`...
JavaScript-实例-button
最新发布
深度安全实验室
07-07 2020
JavaScript-实例-button
button的js代码
07-28
Ext.onReady(function(){ // This function renders a block of buttons function renderButtons(title){ Ext.getBody().createChild({tag: 'h2', html: title}); new ButtonPanel( 'Text Only', [{ text: 'Add User' },{ text: 'Add User', scale: 'medium' },{ text: 'Add User', scale: 'large' }] ); new ButtonPanel( 'Icon Only', [{ iconCls: 'add16' },{ iconCls: 'add24', scale: 'medium' },{ iconCls: 'add', scale: 'large' }] ); new ButtonPanel( 'Icon and Text (left)', [{ text: 'Add User', iconCls: 'add16' },{ text: 'Add User', iconCls: 'add24', scale: 'medium' },{ text: 'Add User', iconCls: 'add', scale: 'large' }] ); new ButtonPanel( 'Icon and Text (top)', [{ text: 'Add User', iconCls: 'add16', iconAlign: 'top' },{ text: 'Add User', iconCls: 'add24', scale: 'medium', iconAlign: 'top' },{ text: 'Add User', iconCls: 'add', scale: 'large', iconAlign: 'top' }] ); new ButtonPanel( 'Icon and Text (right)', [{ text: 'Add User', iconCls: 'add16', iconAlign: 'right' },{ text: 'Add User', iconCls: 'add24', scale: 'medium', iconAlign: 'right' },{ text: 'Add User', iconCls: 'add', scale: 'large', iconAlign: 'right' }] ); new ButtonPanel( 'Icon and Text (bottom)', [{ text: 'Add User', iconCls: 'add16', iconAlign: 'bottom' },{ text: 'Add User', iconCls: 'add24', scale: 'medium', iconAlign: 'bottom' },{ text: 'Add User', iconCls: 'add', scale: 'large', iconAlign: 'bottom' }] ); } renderButtons('Normal Buttons'); ButtonPanel.override({ enableToggle: true }); renderButtons('Toggle Buttons'); ButtonPanel.override({ enableToggle : undefined, menu : {items: [{text:'Menu Item 1'},{text:'Menu Item 2'},{text:'Menu Item 3'}]} }); renderButtons('Menu Buttons'); ButtonPanel.override({ split: true, defaultType: 'splitbutton' }); renderButtons('Split Buttons'); ButtonPanel.override({ split: false, defaultType: 'button', arrowAlign: 'bottom' }); renderButtons('Menu Buttons (Arrow on bottom)'); ButtonPanel.override({ split: true, defaultType: 'splitbutton' }); renderButtons('Split Buttons (Arrow on bottom)'); }); // Helper class for organizing the buttons ButtonPanel = Ext.extend(Ext.Panel, { layout:'table', defaultType: 'button', baseCls: 'x-plain', cls: 'btn-panel', renderTo : 'docbody', menu: undefined, split: false, layoutConfig: { columns:3 }, constructor: function(desc, buttons){ // apply test configs for(var i = 0, b; b = buttons[i]; i++){ b.menu = this.menu; b.enableToggle = this.enableToggle; b.split = this.split; b.arrowAlign = this.arrowAlign; } var items = [{ xtype: 'box', autoEl: {tag: 'h3', html: desc, style:"padding:15px 0 3px;"}, colspan: 3 }].concat(buttons); ButtonPanel.superclass.constructor.call(this, { items: items }); } });
巧用js提交表单轻松解决一个页面有多个提交按钮
12-13
代码如下: <pre class=”javascript” name=”code”>function check(txt){ $j(“form”).submit(function(){ if($txt==”提交”){ this.action=”doAddMessage.action?button=提交”; this.submit(); }else{ this.action=”doAddMessage.action?button=保存”; this.submit(); } }); }</pre><br> <input type=”IMAGE” src=”style/blue/images/but
JavaScript按钮类的简单操作
bolutes
09-27 313
按钮类： 1.页面刷新： functionrenovates() { document.location.reload(); } 2.动态为按钮添加事件： functionaddClick(obj) { obj.onclick=function()//绑定按钮的单击事件 { alert('动态添加事件成功');//单击事件完成的功能－输出提示 } } &lt;inputid="Butto...
用JS控制触发哪一个提交按钮
沉心静气
02-28 595
1、JavaScript 方法： [javascript] document.onkeydown=function(event){ e = event ? event :(window.event ? window.event : null); if(e.keyCode==13){ //执行的方法
JS--JavaScript提交表单（submit事件）、重置表单、取消默认提交表单（单击按钮、回车）
热门推荐
吴声子夜歌的博客
09-27 1万+
提交表单 使用< input > 或 < button >标签都可以定义提交按钮，只要将type属性值设置为“submit”即可，而图像按钮则是通过将 < input >的type属性值设为“image”。当单击按钮或图像按钮时，就会提交表单。 submit事件类型仅在表单内提交按钮，或者在文本框中输入文本时按回车键触发。 示例1：单击【提交】按钮后，触发sub...
JavaScript中的submit和button
sinat_40880767的博客
07-25 757
submit按钮，一旦点击默认提交表单； button按钮，通常用于触发事件，通过onclick指定事件处理函数。 如果表单在点击提交按钮后需要用js进行处理（例如：用户名、密码的验证）后再提交的话，通常要把submit改成button，避免submit自动提交的行为，否则就会造成提交两次的结果。 ...
JS 按钮（button）逃跑
ID_car的博客
11-30 960
直接实例： //逃逸按钮初始位置 .mobileButtonOne { position: absolute; top: 10%; left: 47%; } //初始隐藏真实按钮 .mobileButton { display: none; } <button type="button" class="btn btn-primary mobileButtonOne" id="mobileButton">逃逸按钮</button> <bu
Bootstrap JavaScript插件：按钮 (button.js)
WangMin@汪末末
09-10 1300
作者:WangMin 格言:努力做好自己喜欢的每一件事 优快云原创文章 博客地址 ???? WangMin 状态提示 通过自定义属性和简单的JavaScript，就可以让按钮具有状态提示功能。比如，没有点击按钮时，正常显示；点击按钮时，触发相应的状态，并显示该状态对应的文本信息。 1. 加载状态 要让按钮显示加载状态，首先要给按钮添加 data-loading-text 属性，它的值为加载状态要显示的文本信息，如 “Loading…”： <button type="button" id="myBu
javascript按回车提交按钮
weixin_30575309的博客
08-02 195
第一种:<bodyonload="bgChange(getCookie('sKey'));"onkeydown="if(event.keyCode==13){document.all.btnLogin.click();}">如果是母版页中,则btnLogin换成.<%=btnLogin.ClientID%>.第二种:functiondocument.onkeyd...
掌握JavaScript表单提交的三种技巧
<button type="button" onclick="submitForm()">提交</button> function submitForm() { document.getElementById('myForm').submit(); } ``` ### 3. 使用JavaScript代码直接修改表单的action和method属性 ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值