文件的上传一般不用点击事件,点击事件未发生,事件就已经触发,而使用change事件,change事件会在表单发生改变时触发
juquery无法直接把文件上传,需要一个formData对象来配合着上传才可以
发送ajax进行信息的传输,Php后台进行接受,并且从数据库获取数据,
前端页面:
1.找到上传文件的input框
2.script标签,选择上传文件按钮,把文件上传到后台
3.onclick 文件上传按钮会触发,select下拉框会触发, onchange 值改变
4.获取要上传的文件 var file=this.files[0]
5. data对象:参数,字符串,3.FormData对象(专门上传文件)var data=new FormData();
data.append('file',file);
6.发送ajax
$.ajax({
type:"post",
url:地址
contentType:false, 文件上传必须写,普通不写
processData:false, //上传文件必须写,普通不写
data:data,
success:function(res){ //如果图片上传成功,返回给我图片的地址//把这个地址写在#showImg里面就显示
$("#showImg")attr("src",res).show()
}
})
7. 富文本编辑器(有格式的文本)丰富的文本类容,类似于word的文档
插件--CKEDITOR ueditor
引入富文本js文件 //插入 本质上textarea里面没有内容,我们改的是在div的内容,赋值到textarea里面
初始化渲染出word样式 CKEDITOR.replace(“content”);
//点击保存,把填写的数据发送到后台,后台把他插入到数据库中
本质上textarea里面没有内容,我们改的是在div的内容,赋值到textarea里面
php服务端:
//获取ajax传递过来的数据通过print_r打印出来的是二位数组
1. 获取上传的文件 $file=$_FILES['file'];
2.自己上产一个不重复的名字 $ext=strrchr($file['name'],".")从开始截取到最后jpg
3.$filename=time().rand(10000,99999).$ext;
4.把这个文件存储到你想存储的地方 $bool=move_upload_file($file['tmp_name'])
5.if($bool){ //成功了 返回图片地址
echo '../static/uploads/.$filename';
}else{
echo '文件上传失败';
}
6.富文本编辑器
7.评论管理 前端
1.script标签 -->入口函数-->ajax请求 bootstrap:改变颜色
$(function(){ /
var currentPage=1;
$.ajax({
type:"post"; url:""; data:{currentpage:}
data:{ , }; success:function(res){
if(res.code==1){
var data=res.data;
var str="";
$.each(data,function(i,e){
str='<tr>....</tr>'
});
} } }) })
7.评论管理后台
require_once '../../config.php' require_once '../../function.php'
$currentPage=$_POST['pageSize'];当前页 $pageSize=$_POST['pageSize'];每页显示的条数
$connect=connect(); $sql="";
$queryResult=query($connect,$sql);//二维数组 $response=["code"=>0,"msg"=>"操作失败"];
if($queryResult){ //如果有 证明有查询到了 //成功
$response["code"]=1; $response["msg"]="操作成功"; $response["data"]=$queryResult;
}
header("content-type:application/json;charset=utf8");
echo json_encode($response);