html点击按钮跳转到另一个界面_搭建你的第一个个人数据服务器2.0

e81170997585903e3335a57dad7ce7cf.gif

 研发改变世界 

是的你没有看错

这群敲代码的家伙又来了

是的他们可能会迟到 但永不缺席

8f41edfc95941ac5ab28f267d7030e8f.gif

我们本期的2.0教程将延续着制作有关1.0教程时的热情 ,为大家带来在1.0系统中所示各部分功能实现代码的说明与解释,运用较为简单易懂的方式带大家领略相关数据库操作语言的独特魅力,各位潮人们一起来看看吧!

首先让我们在计算机中的应用程序列表中打开我们熟悉的老朋友,是不是还能勾起潮人们的些许印象呢。

➢ 1. 同时打开xampp与sublime text3

62a93bc49513e50f5890bfdfb2883946.png

7cf21e9aabb6bb0bee68e07191795d68.png

我们在本处打开的两个软件主要运用到了mysql+apache环境的可视化操作

与有关数据库操作语言的编辑运行(此处教程均以php语言作为演示)

(详情的下载安装办法可以参考上期1.0的👉相关内容)

➢2.在xampp可视化界面中实现对Apache与Mysql语言的开启与应用

9c39c7a258f3870ef6b7833aadcf3dbf.png

具体的操作依此为apache->start、mysql->start、apache->admin,mysql->admin的流程,以此达到如图所示的状态效果。

➢3.在环境自带的phpMyAdmin界面中实现对本期教程所需数据库的创建

bd11af394ddeda83298302022acecada.png

单击主菜单导航栏中的新建按钮,来到数据库创建界面。输入库名tb_student,并将语言设定为gb2312_chinese-ci格式进行基础创建

进入创建新表的操作内容

60cfc087910d72b6a532ddc49fcb82e7.png

按如图所示输入内容,并按右下角保存进行创建。等待大功告成

a2c8588fb304b26bcce84aa76a9a213b.png

➢4.创建html+php前后端结合的程序模式

经历了短暂的复习与详解后,终于来到了划重点的时刻,此处是比较复杂。也是各位潮友最容易出错的地方,我们在此时总算隆重请出了我们重点提到的另一位伙伴-sublime text3 各位潮友睁大眼睛一起来看!

(1)在sublime text3中编辑生成前端student.html

b7f88c27160bd8ded600c86ab9fe84e5.png

c1abe1f74f231391bbdbab6862fc8901.png

我们通过三分钟简单几行代码的保存运行做出了一个较为简易的网页框架,用于我们的前端输入。重点需要关注的是如图所示标签中动作目标语法,同时是由提交按钮所触发的。

大家用是需要记住我们在文本框标签代码中的几个”name”名称,这是进行前后端传递的关键所在。其中有关边框标签、文本框的知识我们已经在前几期中做出了解释。欢迎大家翻阅浏览。

(2)生成用于接受传参的后端student.php文件

d38920a40bf299c14040ab406026400e.png

其中行3为定义初期的基本属性,不需要根据实际情况作出修改。

行4界定了所连数据库的名称,行5则是数据库语言转换上的强制定义。

行8-10根据了student.html文本框中的三个name属性做出了一一对应,保证了参数传递的可靠性。

最后通过行14所示的sql语言进行对student表的参数插入。

提示大家在按照图片所示进行代码输入的同时应时刻注意汉英拼写与大小写的转换,一些不容易发现的输入差别会对实际的代码运行造成非常大的影响

➢5.大功告成、检验运行

cd0c10c9dbbfd906db8fde571d19c59d.png

在浏览器中以localhost/为前缀打开编辑完成的student.html文件。根据需求输入文本信息

点击提交按钮实现目的文件的触发与参数传递

00ae673a2b891b62bcc27a88f9185bc4.png

提示加入成功则表示成功录入数据库系统。让我们兴奋的在基于mysql的数据库页面中查看我们所插入的数据结果。

42b964960a76aaeae5ca71b316ab2874.png

fcb40970c0bb3f938edb3397bd7e45ae.gif

至此我们有关个人本地数据库的第二次探索之旅已经大功告成,相信在座的很多小伙伴们已经在观看教程的过程中收获了令人欣喜的成功亦或是宝贵探索精神的充分体现。

我们希望能通过努力从最大程度上向大家展现这个在大家看来或是熟悉亦或是陌生的”神秘领域“。

96574dc6d11122c84dac5ebb8863aca5.png

研发部的探索之路也远还未停止

我们在今后会在学习探索之余

尽可能的为大家带来一些实用新奇的实践分享

 敬请期待,我们下期再见! 

f0818d2a4e447b2d870fff794f0973c9.png

9c26e8423ea422a670c96b9cfae27614.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值