JS控制表單提交的方法
更新時間：2023年05月01日 19:01:11 作者：chunxia
這篇文章主要介紹了JS控制表單提交的方法,可實(shí)現(xiàn)基于javascript提交表單信息的功能,具有一定參考借鑒價值,需要的朋友可以參考下
本文實(shí)例講述了JS控制表單提交的方法。
分享一段代碼實(shí)例，它完全是由javascript動態(tài)實(shí)現(xiàn)的表單提交效果
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dhdzp.com/" />
<title>腳本之家</title>
<script type="text/javascript">
window.onload=function(){
var obt=document.getElementById("bt");
var obox=document.getElementById("box");
var oform=document.createElement("form");
var oinput=document.createElement("input");
oform.method="post";
oform.action="index.php";
oinput.value="jb51.net";
obox.appendChild(oform);
oform.appendChild(oinput);
obt.onclick=function(){
oform.submit();
}
}
</script>
</head>
<body>
<div id="box"></div>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>分享給大家供大家參考。具體如下：
<Script Language="JavaScript">
function autoSubmit(){
var form = document.forms[0];
var actionPath = "?mo=phone";
form.action = actionPath;
form.submit();
return true;
}
</Script>
如果需要兩個提交按鈕，type=""的屬性值一個高為"submit"一個為"button",也就是一個用按鈕本身提交，一個用JS控制提交
<form method="post" name="form1" id="form1" action="?mo=phone&do=opreat" >
<input type="hidden" value="" name="phoneid" id="phoneid">
<table border="0px" style="font-size:12px" width="630px" >
<tr>
<td align="right">手機(jī)型號:</td>
<td><input type="text" id="phonetype" name="phonetype" style="width:120px" <?# if $pinfo.pass_var.phonetype ?>value="<?# $pinfo.pass_var.phonetype ?>" <?# /if ?> /></td>
<td><div id="phonetypeTip" style="width:250px"></div></td>
</tr>
<tr>
<td align="right">類型:</td>
<td><select name="type" id="type">
<?# foreach from=$types item=value ?>
<option value="<?# $value.type ?>"
<?# if $pinfo.pass_var.type== $value.type ?>selected="selected"<?# /if ?>><?# $value.type ?>
</option>
<?# /foreach ?>
</select></td>
<td><div id="typeTip" style="width:250px"></div></td>
</tr>
<tr>
<td align="right">廠商:</td>
<td><select name="brandid" id="brandid">
<?# foreach from=$brand item=value ?><option value="<?# $value.brandid ?>" <?# if $pinfo.pass_var.brandid== $value.brandid ?>selected="selected"<?# /if ?> ><?# $value.name_zh ?></option><?# /foreach ?>
</select></td>
<td><div id="brandidTip" style="width:250px"></div></td>
</tr>
</table>
<input type="submit" value="增加手機(jī)" >
<input type="button" onclick="autoSubmit();" value="搜索手機(jī)" >
</form>
希望本文所述對大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript剩余操作符Rest Operator詳解
在本篇文章里小編給各位分享的是關(guān)于JavaScript剩余操作符Rest Operator知識點(diǎn)用法總結(jié)，有需要的朋友們跟著學(xué)習(xí)下。2019-07-07
JS實(shí)現(xiàn)選項(xiàng)卡實(shí)例詳解
這篇文章主要介紹了JS實(shí)現(xiàn)選項(xiàng)卡的方法,結(jié)合實(shí)例形式詳細(xì)講述了JavaScript實(shí)現(xiàn)選項(xiàng)卡的布局與功能實(shí)現(xiàn)的完整步驟及相關(guān)技巧,需要的朋友可以參考下2015-11-11
JavaScript常規(guī)加密技術(shù)實(shí)現(xiàn)方式詳解
這篇文章主要為大家介紹了JavaScript常規(guī)加密技術(shù)實(shí)現(xiàn)方式詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
前端必知必會的實(shí)現(xiàn)URL查詢參數(shù)的方法詳解
URL?參數(shù)查詢是指在?URL?中使用問號（?）后面附加的鍵值對參數(shù),本文為大家詳細(xì)介紹了前端實(shí)現(xiàn)URL查詢參數(shù)的方法,希望對大家有所幫助2025-02-02
JS判斷form內(nèi)所有表單是否為空的簡單實(shí)例
下面小編就為大家?guī)硪黄狫S判斷form內(nèi)所有表單是否為空的簡單實(shí)例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-09-09
關(guān)于iframe之間的通信問題與自適應(yīng)高度問題網(wǎng)上有很多，那么這篇文章小編也和大家一起來談?wù)刬frame之間通信問題及iframe自適應(yīng)高度問題，有需要的可以參考借鑒。2016-08-08
JavaScript Canvas繪制動態(tài)線框效果
這篇文章主要為大家詳細(xì)介紹了JavaScript Canvas繪制動態(tài)線框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
這篇文章介紹了如何在JavaScript中使用Promise對象來處理異步操作,通過使用fetch()方法和Promise對象,我們可以從后端API獲取數(shù)據(jù)并處理返回值,文章展示了如何使用.then()鏈?zhǔn)讲僮骱蚢sync/await語法來訪問Promise對象的返回值,感興趣的朋友一起看看吧2025-03-03
這篇文章主要介紹了NestJs使用Mongoose對MongoDB操作的方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02
根據(jù)分辨率不同，調(diào)用不同的css文件...2006-07-07