1. 程式人生 > >html表單提交的幾種方法

html表單提交的幾種方法

最普通最常用最一般的方法就是用submit type..看程式碼:

<form name=”form” method=”post” action=”#">

    <input type=”submit” name=”submit” value=”提交">

</form>

另外,還有一種常用的方法是使用圖片:

<form name=”form” method=”post” action=”# ">

    <input type=”image” name=”submit” src=”btnSubmit.jpg”>

</form>

第三種是使用連結來提交表單,用到了javascript的DOM模型:

<form name=”form” method=”post” action=”#”>

    <a href=”javascript:form.submit();”>提交</a>

</form>

這種方法實際上是呼叫了一個javascript函式,使用javacript函式來提交表單,方法就非常多非常靈活了,比如可以把它加入到任意一個標籤的onclick事件中:

<form name=”form” method=”post” action=”#”>

    <div onclick=”javascript:form.submit();”>

        <span>提交</span>

    </div>

</form>

但是,如果一個表單裡有需要有多個提交按鈕怎麼辦呢?

比如一個表單裡的提交按鈕所指向的處理頁面不同,這樣由於表單在定義的時候就已經確定下表單資料的處理頁面,所以單純地在表單裡放多個提交按鈕是沒有辦法達到目的的。這就需要javascript。

首先定義一個函式:

<script language=javascript>

function query(){

form.action=”query.php”;

form.submit();}

function update(){

form.action=”update.php”;

form.submit();}

</script>

通過javascript改變form的action屬性值,這樣就可以實現多提交按鈕而且功能不同了,頁面內程式碼如下:

<form name=”form” method=”post” action=”#”>

    <input type=”button” name=”query” onclick=”query();” value=”查詢”>

    <input type=”button” name=”update” onclick=”update();” value=”更新”>

</form>

上面一段程式碼,使用的是普通的按鈕,而提交功能的實現方法是在它的onclick事件中呼叫javascript函式.

有了上面這幾種提交表單的方法,我想差不多夠應付複雜的表單了.

相關推薦

利用JS提交方法和驗證(必看篇)

www contain 功能 ner ble 四種 利用 comm pac 第一種方式:表單提交,在form標簽中增加onsubmit事件來判斷表單提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

jsp的form提交方式

1.form表單submit直接提交資料 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/j

html提交方法

最普通最常用最一般的方法就是用submit type..看程式碼: <form name=”form” method=”post” action=”#">     <input type=”submit” name=”submit” value

Mvc 提交的4方法全程詳解

c4346 數字 parameter words 代碼 help pro reat src 一,MVC HtmlHelper方法 Html.BeginForm(actionName,controllerName,method,htmlAttributes){}

Form提交方式

text ucc ram rip sub javascrip reg data 方式 <script type="text/javascript"> $(function() { //1、ajax提交 $("#ajaxBtn").click(function

Js提交的兩方法

提交表單一般有兩種一種是submit按鈕,一種是呼叫form的submit方法。雖然都是提交表單,但這兩種還是有些差別的。 一般來說,提交form表單的時候需要做一些簡單的驗證,驗證完後才能提交,避免無效提交。 1.當輸入使用者名稱和密碼為空的時候,需要判斷。這時候就用到了校驗使用者名稱和密碼。方法一 Su

spring mvc 防止重複提交的兩方法,推薦第二

第一種方法:判斷session中儲存的token 比較麻煩,每次在提交表單時都必須傳入上次的token。而且當一個頁面使用ajax時,多個表單提交就會有問題。 註解Token程式碼: package com.thinkgem.jeesite.common.re

使用js提交form的兩方法

提交form表單的時候瑤族一些簡單的驗證,驗證完後才能提交,避免無效提交。 1.當輸入使用者名稱和密碼為空的時候,需要判斷。這時候就用到了校驗使用者名稱和密碼,這個需要在前端頁面寫;有兩種方法,一種是用submit提交。一種是用button提交。方法一: 在jsp的前端頁面的

Html提交到Servlet輸出到頁面亂碼 Html使用的編碼是UTF-8編碼顯示頁面,之後使用form提交欄位到Servlet中,Servlet將利用getParamer方法獲得fo

Html使用的編碼是UTF-8編碼顯示頁面,之後使用form表單提交欄位到Servlet中,Servlet將利用getParamer方法獲得form提交的欄位,之後通過Respone中的writer將獲取到的前臺欄位反饋到前臺中去,出現中午亂碼錯誤,這是因為添加了這個欄位。 response.setCon

使用AJAX非同步提交方式

這裡介紹三種常用的提交方式 方式一 手工收集所有的使用者輸入,封裝為大的“k1=v1&k2=v2…”鍵值對形式,使用$.post(url, data,fn)把資料提交給伺服器 $.aj

webBrowser,控制頁面、提交的兩方法

一、第一種方法貌似網上很少有人提。。。。就是使用javascript去控制頁面。 熟悉javascript的人知道,它主要是用來控制客戶端瀏覽器上行為動作的語言。 用瀏覽器隨便開啟一個頁面,在位址列輸入: javascript:alert("a");void(0); 確認,就

Html中嵌套其他HTML文件的方法(轉)

java mar net rip gin bsp ace wid style 給大家整理了3個方法,一個是HTML的iframe標簽,別兩個是JS引用。比如要在arr.html文件裏引用index.html文件,方法如下。 HTML引用方法: <iframe na

Thinkphp5.0 html提交

cnblogs alt com image 表單 images bsp 測試 logs 首先在form表單中的action中使用url這個方法進行數據的提交,類似thinkphp5以前的U方法,直接在裏面寫上控制器/方法就好, 這樣數據就會直接提交到你填寫的控制器中的方法,

CSS實現下拉菜方法

ansi display ora ble 下拉 技術 body round too PS:轉自https://www.cnblogs.com/yewenxiang/p/6064117.html 第一種:display:none和display:block切換 1 &l

(轉)html 提交時,無法獲取到disabled屬性的input值

有效 AS 單元 java check bsp ado 控件 下拉框 input的字段當為disabled是,無法獲取值,無法改變值,所以在表單提交時,獲取不到值。可以用randomly解決這個問題。 <input name="country" id="countr

資料庫多查詢的方法

資料庫奪標查詢的三種方法: 連線查詢(左外連線,右外連線,完全外連線) 1.傳統方式 /*-- 傳統連線方式 --*/ select e.ename,d.dname from dept d , emp e where d.deptno = e.deptno

jquery、js阻止提交的不同方法

 做web開發的,寫表單提交的程式碼那是家常便飯。既然是要提交表單,那肯定就會進行表單驗證。表單驗證的問題一直都是一件頭疼的事情,爭議也比較大。有些程式設計師會把驗證放在伺服器端,讓伺服器來進行驗證,試想,這樣把資料傳來傳去,效率有多低啊!!如果表單裡的資料量過大,則會嚴重佔用伺服器頻寬。

HTML提交後不彈出新視窗

一、修改form的target屬性 <form name="Myform" action="login/login.php" method="POST" onsubmit="return validateForm()" target="_parent" >

html提交servlet路徑問題

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> &l

HTML提交資料 application/x-www-form-urlencoded 和 multipart/form-data 區別

概述: 在 Form 元素的語法中,EncType 表明提交資料的格式。 用 Enctype 屬性指定將資料回發到伺服器時瀏覽器使用的編碼型別。  說明:  application/x-www-form-urlencoded:窗體資料被編碼為名稱/值對。這是標準的編