PHP+MySQL学习小记

administrator 118 0

练手之PHP IP显示程序

调用系统变量$_SERVER['REMOTE_ADDR']即可收集到。

这里如果UI上要用到垂直居中的话直接调用js,用document.documentElement.clientHeight得到屏幕的高度,然后除以2,减掉这个元素一半的高度,然后继续调用js修改style,把值传给marginTop就可以了[饥饿]

源码早丢了,懒得传了。

练手之PHP简单表单信息收集系统

这个东西直接上代码吧。。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>基本信息收集系统</title>
	<style>
		*{
			margin:0px;
			padding:0px;
		}
	</style>
</head>
<body>
	<!--头部标题样式-->
	<div id="toubu" style="height: 50px;background-color: lightseagreen;text-align: center;">
		<h3 id="toubiao" style="color: white;">
			基本信息收集系统
		</h2>
	</div>
	<script>
		var toubu = document.getElementById("toubu");
		var toubiao = document.getElementById("toubiao");
		toubiao.style.paddingTop = String((toubu.offsetHeight - toubiao.offsetHeight) / 2 - 2) + "px";
	</script>
	<!--中部输入框组-->
	<form action="post.php" method="post">
		<div align="center">
			<div>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:<input name="na" type="text" id="ipt1"></div>
			<div>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:<input name="se" type="text" id="ipt2"></div>
			<div>出生年月:<input name="ye" type="text" id="ipt3"></div>
			<div>电&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;话:<input name="ph" type="text" id="ipt4"></div>
		</div>
			<script>
				var ipt1 = document.getElementById("ipt1");
				var ipt2 = document.getElementById("ipt2");
				var ipt3 = document.getElementById("ipt3");
				var ipt4 = document.getElementById("ipt4");
				ipt1.style.width = String(toubu.offsetWidth / 1.5) + "px";
				ipt2.style.width = String(toubu.offsetWidth / 1.5) + "px";
				ipt3.style.width = String(toubu.offsetWidth / 1.5) + "px";
				ipt4.style.width = String(toubu.offsetWidth / 1.5) + "px";
				ipt1.style.marginTop = "20px";
				ipt2.style.marginTop = "20px";
				ipt3.style.marginTop = "20px";
				ipt4.style.marginTop = "20px";
			</script>
			<!--底部按钮-->
				<button type="submit" id="btn" style="height: 50px">
					提交
				</button>
				<script>
					var btn = document.getElementById("btn");
					btn.style.width = String(toubu.offsetWidth) + "px";
					btn.style.marginTop = String(document.documentElement.clientHeight - document.body.clientHeight) + "px";
				</script>
		</form>
</body>
</html>

它里面还有个POST的PHP用来数据库操作的文件

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>基本信息收集系统</title>
	<style>
		*{
			margin:0px;
			padding:0px;
		}
	</style>
</head>

<?php 
$servername = "localhost"; 
$username = "root"; 
$password = "root";
$dbname = "信息库";	


// 创建连接 
$conn = new mysqli($servername, $username, $password, $dbname); 


	
// 检测连接 
if ($conn->connect_error) { 
    die("<br>Connection failed: " . $conn->connect_error); 
} 
echo "<br>Connected successfully"; 
	
mysqli_query($conn,"set names 'utf8'");

$na = $_POST["na"];
$se = $_POST["se"];
$ye = $_POST["ye"];
$ph = $_POST["ph"];


$sql = "INSERT INTO `信息表` (`ID`, `姓名`, `性别`, `出生年月`, `电话号码`) VALUES (NULL ,  '$na',  '$se',  '$ye',  '$ph');";
	
if ($conn->query($sql) === TRUE) { 
	echo "<br>New record created successfully";
    echo "<br><a href=\"index.php\">返回表单提交页面</a>"; 
} else { 
    echo "<br>Error: " . $sql . "<br>" . $conn->error; 
} 

$conn->close(); 
?>
</html>

这个没啥说的,有个难点,怎么做出来一个吸底的button,我写了一段JavaScript,虽然我也不知道这是什么原理[尴尬]开始有BUG,搞着搞着就成了。。

<script> 
var btn = document.getElementById("btn"); 
btn.style.width = String(toubu.offsetWidth) + "px"; 
btn.style.marginTop = String(document.documentElement.clientHeight - document.body.clientHeight) + "px"; 
</script>

就这样吧[doge]学一点研究一点记一点[得意]

发表评论 取消回复
表情 图片 链接 代码

分享