PbootCMS使用Ajax无刷新提交留言及表单

1年前发布

02314

留言表单

`1`	`<form onsubmit="return submsg(this);">`

`2`	`联系人<input` `type="text"` `name="contacts"` `required` `id="contacts">`

`3`	`手　机<input` `type="text"` `name="mobile"` `required` `id="mobile">`

`4`	`内　容<textarea name="content"` `id="content"></textarea>`

`5`	`验证码<input` `type="text"` `name="checkcode"` `required` `id="checkcode">`

`6`	`<img title="点击刷新"` `src="{pboot:checkcode}"` `onclick="this.src='{pboot:checkcode}?'+Math.round(Math.random()*10);"` `/>`

`7`	`<button` `type="submit">提交留言</button>`

8 </form>

Ajax提交

`01`	`<script>`

`02`	`//ajax提交留言，由于涉及到提交地址标签的解析，JS需要放在html文件中`

`03`	`function` `submsg(obj){`

`04`	`var url='{pboot:msgaction}'; //如果是自定义表单则使用地址{pboot:form fcode=*}`

`05`	`var contacts=$(obj).find("#contacts").val();`

`06`	`var mobile=$(obj).find("#mobile").val();`

`07`	`var content=$(obj).find("#content").val();`

`08`	`var checkcode=$(obj).find("#checkcode").val();`

09

`10`	`$.ajax({`

`11`	`type:` `'POST',`

`12`	`url: url,`

`13`	`dataType:` `'json',`

14 data: {

`15`	`contacts: contacts,`

`16`	`mobile: mobile,`

`17`	`content: content,`

`18`	`checkcode: checkcode`

19 },

`20`	`success:` `function` `(response, status) {`

`21`	`if(response.code){`

`22`	`alert("谢谢您的反馈，我们会尽快联系您！");`

`23`	`$(obj)[0].reset();`

24 }else{

`25`	`alert(response.data);`

26 }

27 },

`28`	`error:function(xhr,status,error){`

`29`	`alert('返回数据异常！');`

30 }

31 });

`32`	`return` `false;`

33 }

`34`	`</script>`

© 版权声明

文章版权归作者所有，未经允许请勿转载。

THE END

综合资源
# 数据

喜欢就支持一下吧

相关推荐

评论抢沙发

欢迎您留下宝贵的见解！

提交

暂无评论内容

随即推荐

RAKsmart高防服务器会影响正常访问速度吗?

RAKsmart高防服务器不会影响正常访问速度，甚至可能因网络优化而更快。以下是技术原理与实测数据支撑，主机推荐小编为您整理发布RAKsmart高防服务器会影响正常访问速度吗?

admin8天前

0417

小红书电商全流程拆解：开店选品+爆款笔记创作，截流曝光与数据复盘指南-铁虎资源网

小红书电商全流程拆解：开店选品+爆款笔记创作，截流曝光与数据复盘指南

本课程系统拆解小红书电商全链路运营，涵盖开店流程、多平台选品（淘宝/拼多多/抖音）、爆款笔记创作（标题/封面/文案）、流量获取（截流/干预/曝光提升）及数据复盘。包含货源解决、批量拍单、...

test2547897422天前

03311

全开源自适应聚合收款单页源码-铁虎资源网

全开源自适应聚合收款单页源码

挺不错的一款自适应聚合收款页源码，源码全开源无加密可以二开，收款对接的是易支付，测试了下码支付也可以用测试环境：PHP7.4 搭建教程

Prostokva__whol14天前

05014

WordPress主题–Xstore v9.4.14 Woocommerce主题破解版下载-铁虎资源网

WordPress主题–Xstore v9.4.14 Woocommerce主题破解版下载

Xstore是WordPress的一款Woocommerce主题，博主没有安装测试过此主题。下载链接内附带有插件，同样未测试。有可能无法使用哦，有需求的自己试下。主题介绍使用我们的皇家设计增强您的电子商务...

uborka_hxmn前天

04111

戒色全书戒色界人士专用软件。不仅仅戒色更是修心-铁虎资源网

戒色全书戒色界人士专用软件。不仅仅戒色更是修心

【应用名称】戒色全书【应用版本】3.5.1【软件大小】38mb【适用型号】安卓【应用说明】戒色界人士专用软件。不仅仅戒色更是修心。

手机版软件

Jonatorag23天前

02412

虚拟手机号，电话验证码，飞机注册-铁虎资源网

虚拟手机号，电话验证码，飞机注册

虚拟手机号，电话验证码，飞机注册虚拟接码关注可以用来做虚拟，批量创号等等很

手机版软件

test72207912天前

0449

DIY主题库会员版-超全个性桌面随意换-铁虎资源网

DIY主题库会员版-超全个性桌面随意换

一款桌面主题组件类软件，有很多种风格的桌面主题可以去使用，全方位美化你的手机桌面，时钟和应用图标都会有专属的主题，壁纸超清的，选择好自己喜欢的一键设置就可以了，每天都可以更换不同的...

手机版软件

Garmcrypto7intab13天前

04811

老照片修复王App可修复模糊、低清、斑驳痕迹等问题-铁虎资源网

老照片修复王App可修复模糊、低清、斑驳痕迹等问题

【资源名称】老照片修复王资源版本】1.3.8（38）【资源大小】78.74M【资源介绍】安卓用户专属神器一键起飞

手机版软件

Valeron83intab15天前

05013

PHP简单的加密卡密管理系统源码-铁虎资源网

PHP简单的加密卡密管理系统源码

卡密验证系统项目介绍卡密验证系统是一款基于 PHP 和 MySQL 开发的轻量级卡密管理工具，适用于虚拟商品销售、会员服务授权等场景。它提供了卡密生成、验证和管理的全套功能，支持加密内容和...

test331611079天前

0269

批量识别身份证并导出excel （收藏备用）-铁虎资源网

批量识别身份证并导出excel （收藏备用）

批量识别身份证并导出excel （收藏备用）由于一些行业需要手动录入大量的身份证信息, 因此编写本软件用于减少工作量。

手机版软件

reflex_oqei6天前

03613