413表格生成

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			h3 {
				color: #2489C5;
				margin-left: 40px;
			}
			
			[type=button] {
				width: 80px;
				height: 30px;
				border: none;
				background-color: green;
				color: white;
				margin-right: 30px;
			}
		</style>
	</head>

	<body>
		<h3>表格生成器</h3>
		<p>
			<label>输入标题:
			   <input type="text" name="biaoti">
		    </label>
		</p>
		<p>
		   <label>输入行:
			  <input type="text" name="rows">
		   </label>
		</p>
		<p>
			<label>输入列:
			   <input type="text" name="cols">
		    </label>
		</p>
		<p>
			<input type="button" name="button1" value="生成表格">
			<input type="button" name="button2" value="重置行列">
		</p>
		<script type="text/javascript" src="../js/jquery.js"></script>
		<script type="text/javascript">
			$('input[name="button1"]').click(function() {
				$('input[name="rows"]'&&'input[name="cols"]').each(
					function(index, obj) {
						if($(obj).val().length == 0) {
							$(obj).after('<span style="color:red">不能为空</span>')
							setTimeout(function() {
								//2秒后,将提示信息删除
								$(obj).next().remove()
							}, 2000)
						} else if(isNaN($(obj).val())) {
							$(obj).after('<span style="color:red">请输入数字</span>')
							setTimeout(function() {
								//2秒后,将提示信息删除
								$(obj).next().remove()
							}, 2000)
						} else if($(obj).val() <= 0) {
							$(obj).after('<span style="color:red">必须大于0</span>')
							setTimeout(function() {
								//2秒后,将提示信息删除
								$(obj).next().remove()
							}, 2000)
						}
					}
				)
				$.get('chuli.php', {
					rows: $('input[name="rows"]').val(),
					cols: $('input[name="cols"]').val(),
					biaoti: $('input[name="biaoti"]').val()
				}, function(data) {
					$('p:last').after(data)
				})
			})
		</script>

</html>

<?php
if($_SERVER['REQUEST_METHOD'] == 'GET'){
	if (!empty($_GET['rows']) && !empty($_GET['cols'])){
		$rows = $_GET['rows'];
		$cols = $_GET['cols'];
		$biaoti = $_GET['biaoti'];
		$table = '<table border="1" cellspacing="0" cellpadding="3" align="center" width="80%"><caption>'.$biaoti.'</caption></tr><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;
	}
}else{
	exit('<span style="color:blue">非法访问</span>');
}
?>

相关文章