当前位置: 首页 > 站长资讯 > 正文页面

织梦自定义表单通过ajax提交的实现方法

自定义表单通过ajax判断,提交不用跳转页面,提高用户体验。具体方法如下:deQ网站目录_网站网址收录与提交入口

html表单代码部分,就提交按钮改成botton,,添加onclick事件deQ网站目录_网站网址收录与提交入口

表单代码:deQ网站目录_网站网址收录与提交入口

<form action="javascript:;" enctype="multipart/form-data" method="post">deQ网站目录_网站网址收录与提交入口

<input type="hidden" name="action" value="post" />deQ网站目录_网站网址收录与提交入口

<input type="hidden" name="diyid" value="1" />deQ网站目录_网站网址收录与提交入口

<input type="hidden" name="do" value="2" />deQ网站目录_网站网址收录与提交入口

<label>姓名:<input type="text" id="name" name="name" value="" /></label>deQ网站目录_网站网址收录与提交入口

<label>电话:<input type="text" id="tel" name="tel" value="" /></label>deQ网站目录_网站网址收录与提交入口

<label>手机:<input type="text" id="iphone" name="iphone" value="" /></label>deQ网站目录_网站网址收录与提交入口

<label>邮箱:<input type="text" id="email" name="email" value="" /></label>deQ网站目录_网站网址收录与提交入口

<table>deQ网站目录_网站网址收录与提交入口

<tr>deQ网站目录_网站网址收录与提交入口

<td valign="top">留言:</td>deQ网站目录_网站网址收录与提交入口

<td><textarea id="liuyan" name="liuyan"></textarea></td>deQ网站目录_网站网址收录与提交入口

</tr>deQ网站目录_网站网址收录与提交入口

</table>deQ网站目录_网站网址收录与提交入口

<input type="hidden" name="dede_fields" value="name,textchar;tel,textchar;iphone,textchar;email,textchar;liuyan,multitext" />deQ网站目录_网站网址收录与提交入口

<input type="button" class="submit fr" value="提 交" onclick="add_ajaxmessage()"/>deQ网站目录_网站网址收录与提交入口

</form>deQ网站目录_网站网址收录与提交入口

js代码(这个代码之前一定要引入jQuery库):deQ网站目录_网站网址收录与提交入口

function add_ajaxmessage(){deQ网站目录_网站网址收录与提交入口

var name=document.getElementById("name");deQ网站目录_网站网址收录与提交入口

var tel =document.getElementById("tel");deQ网站目录_网站网址收录与提交入口

var iphone=document.getElementById("iphone");deQ网站目录_网站网址收录与提交入口

var email=document.getElementById("email");deQ网站目录_网站网址收录与提交入口

var liuyan=document.getElementById("liuyan");deQ网站目录_网站网址收录与提交入口

//定义变量接收上面表单每项的值和几个dede隐藏的input的值deQ网站目录_网站网址收录与提交入口

var dataString = 'name='+ name.value + '&tel=' + tel.value + '&iphone=' + iphone.value + '&email=' + email.value + '&liuyan='+ liuyan.value +'&action=post'+ '&diyid=1&do=2&dede_fields=name,textchar;tel,textchar;iphone,textchar;email,textchar;liuyan,multitext';deQ网站目录_网站网址收录与提交入口

$.ajax({deQ网站目录_网站网址收录与提交入口

type: "POST",deQ网站目录_网站网址收录与提交入口

url: "/plus/diy.php", //提交到后台文件deQ网站目录_网站网址收录与提交入口

data: dataString, //传值deQ网站目录_网站网址收录与提交入口

success: function(data) {deQ网站目录_网站网址收录与提交入口

alert(data);//成功打印PHP返回的值deQ网站目录_网站网址收录与提交入口

}deQ网站目录_网站网址收录与提交入口

});deQ网站目录_网站网址收录与提交入口

return false;deQ网站目录_网站网址收录与提交入口

}deQ网站目录_网站网址收录与提交入口

php代码:deQ网站目录_网站网址收录与提交入口

找到:if(!empty($dede_fields))deQ网站目录_网站网址收录与提交入口

{deQ网站目录_网站网址收录与提交入口

//在里面加入判断语句,不判断也可以deQ网站目录_网站网址收录与提交入口

if($name==""){deQ网站目录_网站网址收录与提交入口

echo "请填写您的姓名!";//注意:输出用echo输出,不要用showMsg();deQ网站目录_网站网址收录与提交入口

exit();deQ网站目录_网站网址收录与提交入口

}deQ网站目录_网站网址收录与提交入口

}deQ网站目录_网站网址收录与提交入口

找到:$goto = !empty($cfg_cmspath) ? $cfg_cmspath : '/';deQ网站目录_网站网址收录与提交入口

$bkmsg = '发布成功,请等待管理员处理...';deQ网站目录_网站网址收录与提交入口

这两句,改成:echo "提交成功!";deQ网站目录_网站网址收录与提交入口

删掉下面这一句:showmsg($bkmsg, $goto);deQ网站目录_网站网址收录与提交入口

以上就是本文章的内容,希望对大家有所帮助。deQ网站目录_网站网址收录与提交入口

  

此文由 网站目录_网站网址收录与提交入口 编辑,未经允许不得转载!:

相关文章