15621857753

PbootCMS前端留言实现上传图片的方法

来源:齐鲁建站 栏目:建站教程 阅读: 日期:2022-05-19

本文介绍了PbootCMS前端留言实现上传图片的方法,PBCMS默认留言没有上传图片的功能,不过可以通过会员上传图片的功能实现这个目的,一起来看看怎么处理吧。

本教程使用的是PbootCMS-V3.1.4版本,亲测有效!

先来看看效果:

1)前端显示的样子

PbootCMS,上传图片,前端留言图片

2)后台显示的样子

PbootCMS,上传图片,前端留言图片

下面来说说PbootCMS前端留言实现上传图片的方法。

一、打开 /comm/upload.html,修改接口如下

uploadUrl: '{pboot:upload}'//会员文件上传接口

需要登录改成如下

uploadUrl: '/index.php?p=/index/upload'//文件上传接口

二、打开 apps/home/controller/IndexController.php ,新增上传接口

public function upload()
    {
        $upload = upload('upload');
        if (is_array($upload)) {
            json(1, $upload);
        } else {
            json(0, $upload);
        }
}

样子如下

PbootCMS,上传图片,前端留言图片

三、打开留言模板 message.html,增加上传图片功能,并在后台和JS中增加字段ico

<div class="form-group">
    <label for="hidden">头像:</label>
    <div style="height:100px; width:100px; border:1px solid #ccc; margin-bottom:2px; border-radius:2px">
     <img src=""  class="headpic" style="max-width:100%;max-height:100%">
    </div>
    <input type="hidden" name="ico" id="ico" class="headpic"  class="form-control">  
    <buttom class="btn btn-success upload" data-target=".headpic" >上传</buttom>
</div>

并在下方引用文件

{include file=comm/upload.html}

这样就可以实现想要的功能了。

响应式网站建设

展开