基于HTML和JavaScript的会议室预约管理系统

已于 2025-02-10 09:48:44 修改
阅读量2.9k 收藏 19
点赞数 5
文章标签： html javascript php 会议室预约管理系统 毕业设计 源码 代码
于 2022-09-29 09:26:34 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/newlw/article/details/127086028
版权
本文介绍了如何使用HTML、JavaScript和PHP开发的会议室管理系统，涉及登录、日期选择、房间预定、查询与管理等功能。通过实例代码展示初始化、后端交互、添加房间及退订操作，并介绍了数据库维护和管理界面的设计。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

目 录

  1. 前端会议室查看初始化代码(index.html) 5
  2. 前段会议室查看初始化代码的后端交互代码(init.php) 5
  3. 初始化后填充已被预定的房间代码(index.html) 7
  4. 添加房间后端模块代码(add.php) 8
  5. 退订房间前端代码模块(order.html) 10
  6. 查询预定记录、退订房间后端代码模块(query.php) 10
  7. 管理房间的前端模块(admin.html) 11
  1. 登录窗口 15
  2. 日期选择 15
  3. 根据需求选用时间段 15
  4. 管理界面，实现对数据库会议楼的维护 16
  5. mysql数据库页面 17

一、实验目的
通过本课程，进一步复习、巩固所学的数据结构与算法、计算机系统基础、密码学基础、社会科学中的计算思维方法等课程的基本概念、技术原理、软件设计的方法与技术等，初步掌握软件设计的流程与基本方法，能够运用C/C++、Java、Python等至少一种编程语言进行软件开发。
二、实验内容
会议室管理与预约系统：设计与开发一个会议室预订与管理系统，功能包括但不限于：支持管理员登录功能、 支持对会议室资源进行管理，会议室资源包括会议室名称、容纳人数等；支持对会议室进行预约管理，本文转载自http://www.biyezuopin.vip/onews.asp?id=14785从满足需求的可用会议室资源中给出预约建议，能够对会议室 进行预约/取消预约
三、实验工具和环境
实验工具：visual studio code、phpstudy、chrome
实验环境：Windows10、LINUX:apache、msql、php
使用语言：HTML、JavaScript、PHP

<!-- /*
*author:gzhu_ruiop
*date：2021-01-13
*des：会议管理系统···预约会议室显示窗口
*会议室的主要窗口用户可以通过该窗口进行查询、预约
*/ -->
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>会议室管理系统</title>
    <link rel="stylesheet" href="css/dcalendar.picker.css"/>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <header>
      <div class="container" id="top">
        <div class="jumbotron">
          <h1>会议室管理系统</h1>
          <h4>Conference room management system</h4>
          <br>
          <br>
          <div class="row">
            <p><a class="btn btn-primary btn-lg" href="#" role="button" id="welcome_span">Welcome!</a></p>
            <h4><a class="pull-right" href="order.html" role="button" id="order_to">已预定</a></h4>
            &nbsp;
            <h4><a class="pull-right" href="login.html" role="button">登出</a></h4>
          </div>         
        </div>
      </div>
      <div class="container">
        <h4>
        <ol class="breadcrumb">
          <li class="active">主界面</li>
          <li><a href="admin.html?building=please_select_building"  target="_blank">管理</a></li>
        </ol>
        </h4>
    </div>
    </header>
    <bodyer>
      <!-- 时间控件 -->
      <div class="container" >
        <div class="panel panel-primary" class="container-fluid">
              <div class="container">
                <div class="row">
                  <div class="col-md-12">
                    <h3>日期<h5> Date</h5></h3>
                  </div>
                </div>
                <div class="conatainer">
                  <div class="row">
                    <div class="col-md-2">
                      <div class="input-group">
                        <input type="text" class="form-control" id="datepicker" name="tmp"  placeholder="Search for..." >
                      </div><!-- /input-group -->
                    </div>
                    <div>
                      <button type="button" class="btn btn-info" id="input_btn">开始查询</button>
                    </div>
                  </div>
                </div>
                <br>
              </div>
        </div>
      </div><!-- 时间控件 -->
      <!-- 会议室主要控件-->
      <div class="container" >
        <div class="panel panel-primary "  class="container-fluid" >
          <!-- 会议室标题 -->
          <div class="row">
            <div class="container">
              <div class="col-md-12"><h3>会议室使用情况<h5>Usage of conference room</h5></h3></div>
            </div>
          </div><!-- 会议室标题 -->
          <!-- 存放会议室属性的所有内容 -->
          <div id="all_panel" ></div>
        </div> 
      </div>
      <!-- 模态框（Modal） 该模态框主要是为了选中合适的房间，选中完之后通过提交按钮通过ajax添加到数据库中-->
      <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
              </button>
              <h4 class="modal-title" id="myModalLabel">
                模态框（Modal）标题
              </h4>
            </div>
            <!--模态框正文内容 -->
            <div class="container"><h4><div id="add_room"></div></h4></div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal" >
                关闭
              </button>
              <button type="button" class="btn btn-primary" id="add_room_btn">
                提交更改
              </button>
            </div>
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->
    </bodyer>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/dcalendar.picker.js"></script>

  </body>
</html>
<script>
  var select_time;//该变量是选中的日期
  var const_add_building_nums='';//该变量是模态框选中的建筑号
  var const_add_room_nums='';//该变量是选中的房间号
  //该函数是获得当前日期的统一格式
  function getDateStr(date)
  {
    var month = date.getMonth() + 1;
    var strDate = date.getFullYear() + '-' + month + '-' + date.getDate();
    return strDate;
  }
  $(document).ready(function()
  {
    //拿到跳转get请求的参数
    var paras = location.search;            //search获得地址中的参数，内容为'?itemId=12'
    var result = paras.match(/[^\?&]*=[^&]*/g);     //match是字符串中符合的字段一个一个取出来，result中的值为['login=xx','table=admin']
    paras = {};                    //让paras变成没有内容的json对象
    for(i in result){
        var temp = result[i].split('=');    //split()将一个字符串分解成一个数组,两次遍历result中的值分别为['itemId','xx']
        paras[temp[0]] = temp[1];
    }
    //修改欢迎标签
    var username = paras.username;     //根据参数名"itemId"，获取参数值
    $('#welcome_span').html("WELCOME!  用户名："+username+"！");

    //将已预定的链接参数修改 
    $('#order_to').attr('href','order.html?username='+username);
    $("#top").css({"margin-bottom":"-30px"});
    $('#datepicker').dcalendarpicker({format: 'yyyy-mm-dd'}).on('datechanged', function(e){});
    $('#input_btn').click(function()
    {
      select_time=$('#datepicker').val();
      //先判断选择时间是否符合标准
      if (select_time=="")
      {
        alert("请选择合适的日期！！！");
        return;
      }
      var d = new Date();
      var tmp=new Date(select_time);
      if (tmp<d)
      {
        alert("请选择合适的日期！！！");
        return;
      }
   
      //先遍历所有的房间
      $.post("init.php",
      {
          name:"init",
      },function(data,status)
      {
        //防止重复点清空
        $('#all_panel').html('');
        var parsedJson = jQuery.parseJSON(data);

        var building=parsedJson[0].building;
        var pre_first="<div class=\"panel panel-primary\"  class=\"container-fluid\" id="+building+" ><div class=\"col-md-12\"><h3>"+"楼号:"+building+"</h3></div></div> ";
        $('#all_panel').append(pre_first);
        for(var i =0;i<parsedJson.length;i=i+2)
        {
          if(building!=parsedJson[i].building)
          {
            building=parsedJson[i].building;
            var pre_first="<div class=\"panel panel-primary\"  class=\"container-fluid\" id="+building+" ><div class=\"col-md-12\"><h3>"+"楼号:"+building+"</h3></div></div> ";
            $('#all_panel').append(pre_first);
          }
          //追加教室 first 门牌号
          //onclick放在最后面 根据数据库请求过来的数据，将数据分解成各个属性框中
          var first="<div class=\"row\"><div class=\"col-md-6\"><div class=\"panel  panel-success\" id=\""+building+"_room_"+parsedJson[i].ID+"\"><div class=\"panel-heading\">"+"<div class=\"row\"><div class =\"col-md-6\"><h4>"+parsedJson[i].ID+"</h4></div><div class=\"col-md-6 \"><button id=\""+building+"_room_"+parsedJson[i].ID+"\" type=\"button\"  class=\"btn btn-primary btn-md pull-right\" data-toggle=\"modal\" data-target=\"#myModal\" onclick='click_func(this)'>选用</button></div></div>";
          first=first+"</div><div class=\"panel-body\"><div class=\"container\"><div class=\"row\"><h3><span class=\"label label-info\">"+"容量"+parsedJson[i].capacity+"/"+parsedJson[i].attribute;
          first=first+"</span> <span class=\"label label-info\">上午</span><span id=\"morning\" class=\"label label-success\" class=\"h5\">空闲</span> <span class=\"label label-info\">下午</span><span  id=\"afternoon\" class=\"label label-success\" class=\"h5\">空闲</span> <span class=\"label label-info\">晚上</span><span id=\"evening\" class=\"label label-success\" class=\"h5\">空闲</span></h3></div></div></div></div></div><div class=\"col-md-6\"><div class=\"panel  panel-success\" id=\""+building+"_room_"+parsedJson[i+1].ID+"\"><div class=\"panel-heading\">"+"<div class=\"row\"><div class =\"col-md-6\"><h4>"+parsedJson[i+1].ID+"</h4></div><div class=\"col-md-6 \"><button id=\""+building+"_room_"+parsedJson[i+1].ID+"\" type=\"button\"  class=\"btn btn-primary btn-md pull-right\" data-toggle=\"modal\" data-target=\"#myModal\" onclick='click_func(this)'>选用</button></div></div>";
          first=first=first+"</div><div class=\"panel-body\"><div class=\"container\"><div class=\"row\"><h3><span class=\"label label-info\">"+"容量"+parsedJson[i+1].capacity+"/"+parsedJson[i+1].attribute;
          first=first+"</span> <span class=\"label label-info\">上午</span><span id=\"morning\" class=\"label label-success\" class=\"h5\">空闲</span> <span class=\"label label-info\">下午</span><span   id=\"afternoon\" class=\"label label-success\" class=\"h5\">空闲</span> <span class=\"label label-info\">晚上</span><span  id=\"evening\" class=\"label label-success\" class=\"h5\">空闲</span> </h3></div></div></div></div></div></div>";
          $('#'+building).append(first);
        }
        //通过请求busy.php脚本将所有数据库中在该时间段出现的时间标签置红
        $.post("busy.php",
        {
            time:select_time,
        },
        function(data,status)
        {
          console.log("busy测试成功"+select_time);
          var parsedJson = jQuery.parseJSON(data);
          for(var i =0;i<parsedJson.length;i++)
          {
            var id_building='#'+parsedJson[i].building;
            var id_room=id_building+'_room_'+parsedJson[i].roomnum;
            var using_time_num=parsedJson[i].usingtime;
            var sql_username=parsedJson[i].username;
            var id_using_time;
            if(using_time_num==1)
            {
              id_using_time="#morning";
            }else if(using_time_num==2)
            {
              id_using_time="#afternoon";
            }else
            {
              id_using_time="#evening";
            }

            if(sql_username==username)
            {
              $(id_room).children().find(id_using_time).html("已订");
              $(id_room).children().find(id_using_time).removeClass("label-success").addClass("label-warning");
            }else
            {
              $(id_room).children().find(id_using_time).html("繁忙");
              $(id_room).children().find(id_using_time).removeClass("label-success").addClass("label-danger");
            }
            console.log("id_room:"+id_room+"id_using_time:"+id_using_time);

            //如果三个标签都为繁忙 那么整个格子变红 并且按钮为禁用
            if(($(id_room).children().find('#morning').hasClass("label-danger")||$(id_room).children().find('#morning').hasClass("label-warning"))&&($(id_room).children().find('#afternoon').hasClass("label-danger")||$(id_room).children().find('#afternoon').hasClass("label-warning"))&&($(id_room).children().find('#evening').hasClass("label-danger")||$(id_room).children().find('#evening').hasClass("label-warning")))
            {
              $(id_room).removeClass("panel-success").addClass("panel-danger");
              $(id_room).children().find('.btn').removeClass("btn-primary").addClass("btn-danger");
              $(id_room).children().find('.btn').html("已满");
            }
          }
        });
      });
    });
    //模态框选中后 按钮添加到数据库
    $('#add_room_btn').click(function()
    {
      var checked = [];
      var checked_str='';
      $("input:checkbox:checked").each(function()
      {
          checked.push($(this).val());
          checked_str+=$(this).val()+",";
      }); 
      $.post("add.php",
      {
        //date是日期 time是时间
        username:username,
        date:select_time,
        building:const_add_building_nums,
        room:const_add_room_nums,
        time:checked_str,
      },
      function(data)
      {
        //关闭模态框并且刷新网页
        $('#myModal').modal('hide');
        $('#input_btn').click();
      });
    });
 });
  //选中选用按钮调用的函数
  function click_func(elem)
  {
    $('#add_room_btn').show();
    $('#add_room').html('');
    $('#myModalLabel').html(elem.id);
    //分割选中的字符串数组
    var tmp=Array();
    var id_room='#'+elem.id;
    //如果flag=0， 代表这个组已经满了 
    var flag=0;
    tmp=elem.id.split("_"); // first room 1
    const_add_building_nums=tmp[0]; //fisrt
    const_add_room_nums=tmp[2] //1
    var morning='';var afternoon='';var evening='';
    //根据标签的颜色判断该时段的标签是否可选，如果可选，将其添加成复选框添加到模态框中
    if($(id_room).children().find('#morning').hasClass("label-success"))
    {
      morning="<div class=\"checkbox\"><label><input type=\"checkbox\" value=\"morning\">"+"上午";
      morning+="</label></div>";
        flag++;
    }
    if($(id_room).children().find('#afternoon').hasClass("label-success"))
    {
      afternoon="<div class=\"checkbox\"><label><input type=\"checkbox\" value=\"afternoon\">"+"下午";
      afternoon+="</label></div>";
        flag++;
    }
    if($(id_room).children().find('#evening').hasClass("label-success"))
    {
      evening="<div class=\"checkbox\"><label><input type=\"checkbox\" value=\"evening\">"+"晚上";
      evening+="</label></div>";
        flag++;
    }
    var all=morning+afternoon+evening;
    //flag为0则代表着三个时间段的标签都为红，都不能选
    if(flag==0){
      $('#add_room').html("所有时间都不可选！");
      $('#add_room_btn').hide();
    }else{
      $('#add_room').append(all);
    }       
  }   
</script>

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

biyezuopinvip
关注
会议室预约系统
rli091的博客
10-31 5192
前言 近期为公司内部开发了一个会议室预约的小工具，作用是可以显示某一时间段的预约信息，并且对预约信息进行增删改查。其中，前端使用html、css 以及原生js,后端使用Servlet,Tomcat以及Highgo Database。以下是整个的设计、开发的过程。 一 、绘制表格 1.表头 行：表头为一周的时间，周一至周日 列：表头为早八点到下午六点半，每半个小时为一个可预约的时间段。 ...
[附源码]java毕业设计基于web场馆预约管理系统
bishe507的博客
11-15 904
项目运行环境配置：Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX（Webstorm也行）+ Eclispe（IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持）。项目技术：SSM + mybatis + Maven + Vue 等等组成，B/S模式 + Maven管理等等。环境需要1.运行环境：最好是java jdk 1.8，我们在这个平台上运行的。其他版本理论上也可以。2.IDE环境：IDEA，Eclipse,Myeclipse都可以。
会议室预约系统源码
07-31
会议室预约源码，课程表样式的，有颜色变化，登录，单元格合并
Java实现实验室预约系统：完整代码解析与运行演示
最新发布
2301_77319192的博客
02-12 499
在高校实验室资源日益紧张的当下，如何巧妙利用信息技术实现实验室的高效预约管理成为关键课题。本文聚焦基于 Java 构建的高校实验室预约系统，如同开启一扇通往智能化管理的大门。 希望可以对刚入门的学弟学妹有所帮助 大家可以借鉴一下这个简单的实验室预约系统，代码我全部发了
基于SSM+JSP的会议室预约系统的设计与实现
JAVA编码选手的博客
06-14 1226
Java SSM会议室预约系统，基于SSM框架进行开发，前端页面效果通过使用JSP进行编码实现，实现了用户跟管理员这两类用户角色，实现了会议室管理、取消预约管理等功能。
Thinkphp会议室预约系统源码
向上力
02-09 1026
3、用户可通过邮箱自助注册，如果是企业防止用户外部用户注册，后台可以通过限制邮箱的后缀来屏蔽外部用户注册。避免管理员大量的维护人员信息和入离职的人员调整。系统源码，站长亲测整体比较简单，就是那种公司企业常用的会议室预约登记系统，基于fastadmin管理系统开发的。1、会议室可以设置会议室预约免审批和需审批，大型的VIP会议室可以设置为需审批，小型的会议室可设置为免审批；4、在会议室门口可摆放大屏幕，投屏会议室的当天会议室预约情况。系统后台提供了会议室的管理功能，用户可以手机端和电脑端来预约会议室。
Java项目之会议室预约系统（源码）
05-11
Java项目之会议室预约系统（源码） 开发语言：Java 框架：ssm 技术：JSP JDK版本：JDK1.8 服务器：tomcat7 数据库：mysql 5.7（一定要5.7版本） 数据库工具：Navicat11 开发软件：eclipse/myeclipse/idea Maven包：Maven3.3.9
基于JavaWeb的会议室预约管理系统设计与实现.zip
06-27
资源包含文件：lunwen文档word+...会议室预约管理系统基于B/S结构，采用JAVA作为编写语言、通过JavaScript和JSP、MYSQL等工具及技术实现功能。 详细介绍参考：https://blog.csdn.net/newlw/article/details/125142579
基于Python和Django的开源会议室预约系统设计源码
04-15
基于Python和Django的开源会议室预约系统设计源码，该项目包含104个文件，主要文件类型有34个python源文件，以及18个javascript文件。此外，还包括13个json配置文件，以及12个微信小程序的wxss样式文件。该项目是一...
基于PHP会议室预约管理系统源码带手机端.zip
05-28
【标题】基于PHP的会议室预约管理系统源码是一个用于实现会议室预定功能的应用程序，它结合了Web技术和数据库管理，便于用户通过网页或者手机端进行会议室的预订。系统支持多用户访问，能够有效地协调和管理会议室...
基于Python、Shell、HTML的线下会议室预约管理系统设计源码
10-01
本项目提出的“基于Python、Shell、HTML的线下会议室预约管理系统设计源码”正是顺应这一需求应运而生的解决方案。该系统通过采用流行的编程语言和前端技术，为用户提供了一个简洁而高效的预约平台。 系统的设计...
预约系统源码
08-20
预约推广系统源码
Java会议室预约系统源码.zip
06-23
Java会议室预约系统源码.zip
基于SSM的会议室预约系统源码.zip
06-18
源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经过本地编译可运行的，下载完成之后配置相应环境即可使用。源码功能都是经过老师肯定的，都能满足要求，有需要放心下载即可。源码是经
基于html5的会议管理系统的原型设计
05-23
这是一个基于html5的会议管理系统的原型设计，使用了自定义的css样式
基于Java后端和Vue、JavaScript、CSS、HTML的前端设计的会议室预约系统前端源码
10-03
系统前端源码中的JavaScript文件和Vue组件文件共同构成了一个功能完备的会议室预约界面，用户可以通过该界面轻松查看会议室的状态、进行预约和管理预约。而且，本系统前端源码的设计也考虑到了维护和后续开发的便利...
基于springboot+mybatis+mysql+html实现医院预约挂号管理系统
Timi2019的博客
12-31 1513
系统总体分为3个角色：分别是系统管理员；医生和用户；不能的角色拥有不同的功能权限，下面详细介绍：系统管理员:首页医生管理预约信息管理医生反馈管理科室管理评介管理用户管理角色管理菜单管理医生：首页（留言板、我的预约）我的预约日程对我的评介用户：首页（留言板、我的预约）就诊预约我的预约我参与的评介。
CSM会议室预约系统源码
03-30 343
安装同thinkphp，上传，新建并导入数据库，修改application下的database.php 数据库连接信息，设置tp伪静态，设置public为运行目录，后台用户名admin,1.会议室可以设置会议室预约免审批和需审批，大型的VIP会议室可以设置为需审批，小型的会议室可设置为免审批；4.在会议室门口可摆放大屏幕，投屏会议室的当天会议室预约情况。系统后台提供了会议室的管理功能，用户可以手机端和电脑端来预约会议室。CSM会议室预约是一款手机可申请的会议室预约系统，适合企业版用户。
SSM框架打造会议室预约管理系统
通过以上知识点的概述，我们可以了解到基于SSM框架实现会议室预约管理系统的技术细节和功能特点，同时对于该系统所适用的场合和开发过程中的技术选型有了清晰的认识。该系统在功能上全面，操作界面简洁，适合作为...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值