cms ajax,用PbootCms的API接口制作Ajax无刷新留言

前言

我们在制作模板的过程中，经常会使用到留言板等表单提交功能，常规的表单提交方式每次提交会有一个跳转，对访客不友好。有没有更好的UEO(用户体验)方案呢？有的，PbootCms有留言、表单的API接口，我们来做一个Ajax方式提交留言 。

实现过程

首先，写好表单的HTML代码。

联系我们

上面的代码其实不重要，关键就是表单的action留空，表单元素(input、tetxerea等)的name和后台的表单字段对应。

其他的就根据自己页面样式需求来写即可。

接下来是重点：

1、首先Ajax提交需要在表单的按钮点击的时候触发。//.hengbok-home-contact button 就是表单中的button提交按钮

jQuery('.hengbok-home-contact button').on('click', function(){

//执行代码

});

注：以下的代码都写在上面的执行代码中。

2、定义一些需要用到的变量。var url  = '/api.php/cms/addmsg';    //Api的地址，我这里是留言接口，如果自定义表单的话填写表单接口

//定义data对象，默认包含appid,timestamp和signature

var data = {

appid: '{@pboot:appid}',

timestamp: '{@pboot:timestamp}',

signature: '{@pboot:signature}',

};

//定义一个空数组，用来储存表单提交过来的内容

var parm = new Array();

//将表单提交过来的内容储存到数组中去

parm['contacts'] = jQuery('#Contacts').val();

parm['home_contact_mail'] = jQuery('#Home_contact