共计 3220 个字符，预计需要花费 9 分钟才能阅读完成。
<!DOCTYPE html><html lang=”zh-CN”><head> <meta charset=”utf-8″> <title>Add new post « Admin</title> <link rel=”stylesheet” href=”../static/assets/vendors/bootstrap/css/bootstrap.css”> <link rel=”stylesheet” href=”../static/assets/vendors/font-awesome/css/font-awesome.css”> <link rel=”stylesheet” href=”../static/assets/vendors/nprogress/nprogress.css”> <link rel=”stylesheet” href=”../static/assets/css/admin.css”> <script src=”../static/assets/vendors/nprogress/nprogress.js”></script></head><body> <script>NProgress.start()</script>
<div class=”main”> <?php include_once “public/_navbar.php”?>
<div class=”container-fluid”>
<div class=”page-title”>
<h1> 写文章 </h1>
</div>
<!– 有错误信息时展示 –>
<!– <div class=”alert alert-danger”>
<strong> 错误！</strong> 发生 XXX 错误
</div> –>
<form id=”dataForm” class=”row”>
<div class=”col-md-9″>
<div class=”form-group”>
<label for=”title”> 标题 </label>
<input id=”title” class=”form-control input-lg” name=”title” type=”text” placeholder=” 文章标题 ”>
</div>
<div class=”form-group”>
<label for=”content”> 标题 </label>
<textarea id=”content” class=”form-control input-lg” name=”content” cols=”30″ rows=”10″ placeholder=” 内容 ”></textarea>
</div>
</div>
<div class=”col-md-3″>
<div class=”form-group”>
<label for=”slug”> 别名 </label>
<input id=”slug” class=”form-control” name=”slug” type=”text” placeholder=”slug”>
<p class=”help-block”>https://zce.me/post/<strong>slug</strong></p>
</div>
<div class=”form-group”>
<label for=”feature”> 特色图像 </label>
<!– show when image chose –>
<img id=”showPic” class=”help-block thumbnail” style=”display: none”>
<input id=”feature” class=”form-control” name=”feature” type=”file”>
</div>
<div class=”form-group”>
<label for=”category”> 所属分类 </label>
<select id=”category” class=”form-control” name=”category”>
<option value=”1″> 未分类 </option>
<option value=”2″> 潮生活 </option>
</select>
</div>
<div class=”form-group”>
<label for=”created”> 发布时间 </label>
<input id=”created” class=”form-control” name=”created” type=”datetime-local”>
</div>
<div class=”form-group”>
<label for=”status”> 状态 </label>
<select id=”status” class=”form-control” name=”status”>
<option value=”drafted”> 草稿 </option>
<option value=”published”> 已发布 </option>
</select>
</div>
<div class=”form-group”>
<input type=”button” id=”btn_save” value=” 保存 ” class=”btn btn-primary”>
</div>
</div>
</form>
</div>
</div> <?php $current_page = “post-add”; ?> <?php include_once “public/_aside.php”?>
<script src=”../static/assets/vendors/jquery/jquery.js”></script> <script src=”../static/assets/vendors/bootstrap/js/bootstrap.js”></script> <script>NProgress.done()</script> <!– 引入富文本插件 –> <script src=”../static/assets/vendors/ckeditor/ckeditor.js”></script> <script> $(function(){
$(“#feature”).on(“change”,function(){
var file = this.files[0];
// new 一个 formDddata 的实例
var data = new FormData();
// 使用 XMLHttpRequest2.0 中的 FromData 对象处理数据 因为图像是二进制的不可见
data.append(“file”,file);
$.ajax({
type:”POST”,
url:”api/_upFileData.php”,
data:data,
contentType:false, /* 防止设置请求头 因为 formData 是不可以设置请求头的 */
processData:false, /* 防止进行格式编码 */
success:function(res){
// console.log(res);
if(res.code==1){
$(“#showPic”).attr(“src”,res.src).show();
}
}
});
}) // 富文本初始化 content 是 textarea 的 id CKEDITOR.replace(‘content’); $(“#btn_save”).on(“click”,function(){
CKEDITOR.instances.content.updateElement();// 把编译器里面的内容更新到文本域当中
var data = $(“#dataForm”).serialize(); $.ajax({
type:”POST”,
data:data,
url:”api/_getpost.php”,
success:function(res){
console.log(res);
}
})
}) }) </script></body></html>