跳蚤市场之商品发布功能
一 商品类别和小类的联动
以下是一个示例代码，展示了如何实现商品类别中大类和小类的联动。
商品大类选择框、小类选择框 的设计
html部分
<form id="category-form">
<label for="major-category">大类：</label>
<select id="major-category" name="major_category">
<option value="" disabled selected>请选择大类</option>
<option value="clothing">服装</option>
<option value="electronics">电子产品</option>
<option value="furniture">家具</option>
</select>
<label for="minor-category">小类：</label>
<select id="minor-category" name="minor_category">
<option value="" disabled selected>请选择小类</option>
</select>
</form>商品大类和小类的联动
JavaScript部分：
// 大类和小类的对应关系
const categoryMapping = {
clothing: ["衣服", "鞋子", "包包"],
electronics: ["手机", "电脑", "相机"],
furniture: ["沙发", "床", "桌子"]
};
// 获取大类和小类的select元素
const majorCategorySelect = document.getElementById("major-category");
const minorCategorySelect = document.getElementById("minor-category");
// 监听大类select的变化
majorCategorySelect.addEventListener("change", function() {
const selectedMajorCategory = majorCategorySelect.value;
// 根据大类的选择更新小类的options
updateMinorCategoryOptions(selectedMajorCategory);
});
// 根据大类的选择更新小类的options
function updateMinorCategoryOptions(selectedMajorCategory) {
// 清空小类的options
minorCategorySelect.innerHTML = "";
// 获取对应的小类数组
const minorCategories = categoryMapping[selectedMajorCategory];
// 创建小类的options
minorCategories.forEach(function(minorCategory) {
const option = document.createElement("option");
option.value = minorCategory;
option.textContent = minorCategory;
minorCategorySelect.appendChild(option);
});
}上述代码中，我们首先定义了一个大类和小类的对应关系`categoryMapping`，然后通过JavaScript获取到大类和小类的select元素，并监听大类select的变化。当大类发生变化时，我们根据所选的大类来更新小类的options。
在`updateMinorCategoryOptions`函数中，我们首先清空小类的options，然后根据所选的大类获取对应的小类数组，并通过遍历创建小类的options。最后，将创建好的options添加到小类的select元素中。
二 图片的上传
下面是一个简单的PHP图片上传的示例代码：
<!DOCTYPE html>
<html>
<head>
<title>图片上传</title>
</head>
<body>
<h1>图片上传</h1>
<?php
// 检查是否有文件上传
if(isset($_FILES['image'])){
$errors = array();
$file_name = $_FILES['image']['name'];
$file_size = $_FILES['image']['size'];
$file_tmp = $_FILES['image']['tmp_name'];
$file_type = $_FILES['image']['type'];
$file_ext = strtolower(end(explode('.', $_FILES['image']['name'])));
$extensions = array("jpeg", "jpg", "png");
// 检查文件类型和大小
if(in_array($file_ext, $extensions) === false){
$errors[] = "扩展名不被支持，请选择 JPEG 或 PNG 文件.";
}
if($file_size > 2097152){
$errors[] = '文件大小不能超过 2MB.';
}
// 如果没有错误，则上传文件
if(empty($errors) == true){
move_uploaded_file($file_tmp, "uploads/" . $file_name);
echo "文件上传成功！";
}
else {
print_r($errors);
}
}
?>
<form action="" method="POST" enctype="multipart/form-data">
<input type="file" name="image" />
<input type="submit"/>
</form>
</body>
</html>这个示例代码有以下部分：
- 在
<form>标签里设置enctype="multipart/form-data"，这样表单可以上传文件。 - 在PHP代码中，
$_FILES变量用于获取上传的文件信息。 - 检查文件的扩展名和大小，如果不符合要求则添加错误信息到
$errors数组中。 - 如果没有错误，则使用
move_uploaded_file()函数将文件从临时位置移动到指定的文件夹中。 - 如果有错误，使用
print_r()函数输出错误信息。
请注意，这只是一个简单的示例，未包含对文件的安全性验证。在实际应用中，你可能需要进一步验证文件类型和大小，以及限制上传文件的扩展名和大小。
三 确定客户是否登录
以下是一个示例代码，用于在PHP中检查客户是否登录：
代码如下：
<?php
session_start();
// 判断用户是否已经登录
if(isset($_SESSION['is_logged_in']) && $_SESSION['is_logged_in'] === true) {
// 用户已经登录
echo "用户已经登录";
} else {
// 用户未登录
echo "用户未登录";
}
?>在这个示例中，我们使用了`session_start()`函数来启动会话，并通过`$_SESSION`超全局数组来访问会话数据。
如果用户已经登录，并且会话中的`is_logged_in`键的值为`true`，则输出"用户已经登录"。否则，输出"用户未登录"。
注意：在检查登录状态之前，确保已经设置了正确的会话变量和值。这通常在用户登录时完成，例如在验证用户凭据后设置`$_SESSION['is_logged_in'] = true;`。
四 跳蚤市场商品发布功能实例
1. 商品发布（出售）效果
2. 商品发布（出售） 代码
publish_sell.php代码 如下：
<?php
session_start();
if($_SESSION['id']==''){
echo "<script>alert('你尚未登录，请登录！');</script>";
echo "<script>location.href='login.php'</script>";
}
include_once 'conn.php'; //引入数据库文件
if(isset($_POST['product_name'])){
//获取商品发布信息
$product_name=$_POST['product_name'];
$large_id=$_POST['large_type'];
$small_id=$_POST['small_type'];
$manufacturer=$_POST['manufacturer'];
$model=$_POST['model'];
$specification=$_POST['specification'];
$product_unit=$_POST['product_unit'];
$product_number=$_POST['product_number'];
$original_price=$_POST['original_price'];
$current_price=$_POST['current_price'];
$illustrate=$_POST['illustrate'];
$new_old=$_POST['new_old'];
$year=$_POST['year'];
$month=$_POST['month'];
$day=$_POST['day'];
$purchase_date=$year.'-'.$month.'-'.$day;
$publish_date=date("Y-m-d");
$in_out='进';
$custom_id=$_SESSION['id'];
$sql="insert into product(large_id,small_id,custom_id,product_name,product_model,specification,product_unit,product_number,originial_price,current_price,manufacturer,illustrate,purchase_date,new_old,publish_date,in_out) values ('$large_id','$small_id','$custom_id','$product_name','$model','$specification','$product_unit','$product_number','$original_price','$current_price','$manufacturer','$illustrate','$purchase_date','$new_old','$publish_date','$in_out')";
if($conn->query($sql)){
echo "<script>alert('出售商品增加成功，请上传商品图片');</script>";
echo "<script>location.href='upload.php'</script>";
} else {
echo "<script>alert('出售商品发布不成功');</script>";
echo "<script>location.href='publish_sell.php'</script>";
}
}?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>发布出售商品信息</title>
<link rel="stylesheet" type="text/css" href='css/sell.css'>
<style>
.select1{
width:200px;
font-size:16px;
padding:5px;
border:1px solid blue;
}
.select2{
font-size:16px;
padding:5px;
border:1px solid blue;
}
</style>
<script>
var s=new Array();
<?php
$i=0;
$sql='select * from small_type';
$result=$conn->query($sql);
if($result->num_rows>0){
while($row=$result->fetch_assoc()){
?>
s[<?php echo $i; ?>]=new Array(<?php echo $row['large_id'] ?>,<?php echo $row['small_id'] ?>,<?php echo "'".$row['small_name']."'" ?>);
<?php $i=$i+1; }}?>
</script>
<script src="js/publish.js"></script>
</head>
<body>
<div align="center">
<iframe src='top.html' style='border:none;width:1020px; margin-bottom:-10px;'>
</iframe>
</div>
<div align="center">
<form action='' method='post' name='sellform' onsubmit="return sell_submit()">
<table border='0' width='1000'>
<tr>
<td colspan='2' class='input_title'>发布出售商品信息</td>
</tr>
<tr>
<td align='right' width='400'>
<span class='input_label'>品名</span>
</td>
<td>
<input type='text' name='product_name' class='input' required placeholder="品名不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right' width='400'>
<span class='input_label'>大类名</span>
</td>
<td>
<select name='large_type' class='select1' onchange="change(this.value)">
<option>请选择</option>
<?php
$sql="select * from large_type";
$result=$conn->query($sql);
if($result->num_rows>0){
while($row=$result->fetch_assoc()){
echo "<option value='".$row['large_id']."'>".$row['large_name']."</option>";
}
}
?>
</select>
</td>
</tr>
<tr>
<td align='right' width='400'>
<span class='input_label'>小类名</span>
</td>
<td>
<select name='small_type' class='select1'>
<option>请选择</option>
</select>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>生产厂商</span>
</td>
<td>
<input type='text' name='manufacturer' class='input' required placeholder="生产厂家不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>型号</span>
</td>
<td>
<input type='text' name='model' class='input' required placeholder="型号不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>规格</span>
</td>
<td>
<input type='text' name='specification' class='input' required placeholder="规格不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>单位</span>
</td>
<td>
<input type='text' name='product_unit' class='input' required placeholder="单位不能为空">
<span class='tip'>*</span>
</td>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>数量</span>
</td>
<td>
<input type='text' name='product_number' class='input' required placeholder="数量不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>原价</span>
</td>
<td>
<input type='text' name='original_price' class='input' r placeholder="原价不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>现价</span>
</td>
<td>
<input type='text' name='current_price' class='input' required placeholder="现价不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>说明</span>
</td>
<td>
<textarea name='illustrate' cols=40 rows=10 style='font-size:16px;border:1px solid blue;'></textarea>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>新旧</span>
</td>
<td>
<input type='text' name='new_old' class='input' required placeholder="新旧不能为空">
<span class='tip'>*</span>
</td>
</tr>
<tr>
<td align='right'>
<span class='input_label'>购买日期</span>
</td>
<td>
<select name="year" class='select2'>
<?php
for($year=date("Y");$year>date("Y")-10;$year--){
echo "<option value='".$year."'>".$year."</option>";
}
?>
</select>
年
<select name="month" class='select2' onchange="dd()">
<?php
for($month=1;$month<=12;$month++)
{ echo "<option value='".$month."'>".$month."</option>";}
?>
</select>
月
<select name="day" class='select2'>
<?php
for($day=1;$day<=31;$day++)
{ echo "<option value='".$day."'>".$day."</option>";}
?>
</select>
日
</td>
</tr>
<tr>
<td colspan='2' align='center'>
<input type='submit' class='button' value='提交'>
<input type='reset' class='button' value='重置'>
</td>
</tr>
</table>
</form>
</div>
<div align="center">
<iframe src='bottom.html' style='border:none;width:1020px; margin-bottom:-10px;'>
</div>
</body>
<?php $conn->close(); ?>
</html>3 . 图片上传效果
4 图片上传代码
upload.php如下：
<?php
session_start();
if($_SESSION['id']==''){
echo "<script>alert('你尚未登录，请登录！');</script>";
echo "<script>location.href='login.php'</script>";
}
include 'conn.php'; //引入数据库文件
$allowedExts=array("gif","jpeg",'jpg','png');
$uploadDir="uploads/"; //上传目录
$custom_id=$_SESSION['id']; //客户编号
if(isset($_FILES['upfile'])){
$temp=explode(".",$_FILES['upfile']['name']);
$extension=end($temp);
//检查文件类型是否为jpg、gif、png
if(!in_array($extension,$allowedExts)){
echo "<script>alert('只允许上传 JPG, JPEG, PNG 或 GIF 格式的图片');</script>";
echo "<script>location.href='upload.php'</script>";
}
//检查文件大小是否超标
$fileMaxSize=2000000; //1mb
if($_FILES['upfile']['size']>$fileMaxSize){
echo "<script>alert('文件大小不能超过 1MB');</script>";
echo "<script>location.href='upload.php'</script>";
}
// 生成唯一的文件名（可选）
$uniqueFileName = uniqid() . '.' . $extension;
//创建目标目录
if(!is_dir($uploadDir)) {
mkdir($uploadDir);
}
//将文件从临时目录移动到目标目录
$targetDir=$uploadDir. $uniqueFileName;
if(move_uploaded_file($_FILES['upfile']['tmp_name'], $targetDir)){
$sql="select * from product where custom_id='$custom_id' order by product_id desc";
$result=$conn->query($sql);
$row=$result->fetch_assoc();
$product_id=$row['product_id'];
$sql="update product set photo='$uniqueFileName' where product_id=$product_id";
$conn->query($sql);
echo "<script>alert('图片上传成功')</script>";
echo "<script>location.href='publish_sell.php'</script>";
} else {
echo "<script>alert('图片上传失败，请重新上传')</script>";
echo "<script>location.href='upload.php'</script>";
}
}
//关闭连接
$conn->close();
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>图片上传</title>
<link rel="stylesheet" type="text/css" href='css/register.css'>
<script>
function validInput(){
if(document.upform.upfile.value==""){
alert("请选择上传文件！");
document.upform.upfile.focus();
return false;
}
return true;
}
</script>
</head>
<body>
<div align="center">
<iframe src='top.html' style='border:none;width:1020px; margin-bottom:-10px;'>
</iframe>
</div>
<div align="center">
<form action='' name='upform' method='post' onsubmit="return validInput()" enctype='multipart/form-data'>
<p align="center"><font size="+2">图片上传</font></p>
<p align="center">请选择图片文件的地址：
<input type="file" name="upfile" size="40">
<input type="submit" value="上传">
</p>
</form>
<p align="center"><a href="index.php">首页</a> <a href="javascript:close();">退出</a></p>
</div>
<div align="center">
<iframe src='bottom.html' style='border:none;width:1020px; margin-bottom:-10px;'>
</div>
</body>
</html>5 相关表
表的定义SQL:
商品表
//商品表
CREATE TABLE IF NOT EXISTS `product` (
`product_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '商品编号',
`large_id` int(11) NOT NULL COMMENT '大类名',
`small_id` bigint(20) NOT NULL COMMENT '小类名',
`custom_id` int(11) NOT NULL COMMENT '客户编号',
`product_name` varchar(20) COLLATE utf8_unicode_ci NOT NULL COMMENT '品名',
`product_model` varchar(20) COLLATE utf8_unicode_ci NOT NULL COMMENT '型号',
`specification` varchar(20) COLLATE utf8_unicode_ci NOT NULL COMMENT '规格',
`product_unit` varchar(2) COLLATE utf8_unicode_ci NOT NULL COMMENT '单位',
`product_number` int(11) NOT NULL COMMENT '数量',
`originial_price` decimal(12,0) NOT NULL COMMENT '原价',
`current_price` decimal(12,0) NOT NULL COMMENT '现价',
`manufacturer` varchar(30) COLLATE utf8_unicode_ci NOT NULL COMMENT '生产厂家',
`illustrate` varchar(255) COLLATE utf8_unicode_ci NOT NULL COMMENT '说明',
`photo` varchar(30) COLLATE utf8_unicode_ci NOT NULL COMMENT '图片',
`purchase_date` datetime NOT NULL COMMENT '购买日期',
`new_old` varchar(6) COLLATE utf8_unicode_ci NOT NULL COMMENT '新旧',
`publish_date` datetime NOT NULL COMMENT '发布时间',
`state` varchar(2) COLLATE utf8_unicode_ci NOT NULL DEFAULT '在售' COMMENT '状态',
`in_out` varchar(1) COLLATE utf8_unicode_ci NOT NULL COMMENT '进出',
PRIMARY KEY (`product_id`),
KEY `large_id` (`large_id`),
KEY `small_id` (`small_id`),
KEY `custom_id` (`custom_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=8 ;
大类表
//表的结构 `large_type`
CREATE TABLE IF NOT EXISTS `large_type` (
`large_id` int(11) NOT NULL COMMENT '大类号',
`large_name` varchar(8) COLLATE utf8_unicode_ci NOT NULL COMMENT '大类名',
PRIMARY KEY (`large_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;小类表
//表的结构 `small_type`
CREATE TABLE IF NOT EXISTS `small_type` (
`large_id` int(11) NOT NULL COMMENT '大类号',
`small_id` bigint(20) NOT NULL COMMENT '小类号',
`small_name` varchar(8) COLLATE utf8_unicode_ci NOT NULL COMMENT '小类名',
PRIMARY KEY (`small_id`),
KEY `large_id` (`large_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;