实例

<?php
//判断用户的请求类型是否合法,必须是GET请求

if ($_SERVER['REQUEST_METHOD']== 'GET'){
	if (!empty($_GET['rows']) && !empty($_GET['cols']))
		$rows = $_GET['rows'];
		$cols = $_GET['cols'];
		//用短变量名称进行转存
		$table = '<table border="1" cellspacing="0" cellpadding="3" align="center" width="80%">';
		//创建表格的基本结构,采用字符串拼接方式,最后统一生成,提高效率
		//下面用双重循环来生成这个表格
		$table .= '<tr align="center" bgcolor="lightgreen">';
		for ($i=0; $i<$$cols;$i++){
			$table .= '<th>x</th>';
		}
		$table .= '</tr>';
		for ($r=0; $r<$rows; $r++){
			$table .= '<tr>';
			for ($c=0; $c<$cols; $c++){
				//设置单元格的数据,数据与单元格数量对应
				$data = $r*$cols+$c;
				$table .= '<td align="center">'.++$data.'</td>';
			}
			$table .= '</tr>';
		}
		$table .= '</table>';

		echo $table;
		exit();
	}
}else{

	exit('<span style="color:red">请求类型错误</span>');
}


?>

运行实例 »

点击 "运行实例" 按钮查看在线实例

实例

<!DOCTYPE html>

<html lang="en">
 
<head>
<meta charset="utf-8" />
<title>实战 表格生成器</title>

<style type="text/css">
H3{
	color:red;
	margin-left:40px;

}
button{

	width:80px;
	height:30px;
	margin-left:30px;
	border:none;
	background-color:green;
	color:white;
}
</style>
<script type=text/javascript src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>

</body>
<H3>表格生成器</H3>
<p><label>输入行:<input type="text" name="rows"></label></p>
<p><label>输入列:<input type="text" name="cols"></label></p>
<p><button>生成表格</button><button>重置表格</button></p>

<script type="text/javascript">
  //首先创建一个请求标志,防止重复生成;
  var flag=true
  $('button:first').on('click',function()
  {
//遍历并验证用户输入的信息



  }






  	)


</script>



</body>


</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例