生成带有标题的表格
实例 页面
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
h3{
color: red;
}
button{
width: 60px;
height: 20px;
border: none;
background-color: blue;
color: white;
margin-left: 20px;
}
</style>
</head>
<body>
<!-- <table>
<tr>
<th colspan="" rowspan=""></th>
</tr>
</table>-->
<h3>我的表格生成器</h3>
<p>标题:<input type="text" name="name" ></p>
<p>行数:<input type="text" name="rows" ></p>
<p>列数:<input type="text" name="cols" ></p>
<p><button>生成</button><button>重置</button></p>
<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script>
//创建请求标志，防止重复请求
var flag = true;
$('button:first').on('click', function () {
// alert(12)测试
$(':input').eq(1).not('button').each(function (index, obj) {
if ($(obj).val().length == 0) {
$(obj).after('<span>不能为空</span>')
setTimeout(function () {
$(obj).next().remove()
}, 1000)
return false;
} else if (isNaN($(obj).val())) {
$(obj).after('<span>必须为数字</span>')
setTimeout(function () {
$(obj).next().remove()
}, 1000)
return false;
} else if ($(obj).val() <= 0) {
$(obj).after('<span>不能为0</span>')
setTimeout(function () {
$(obj).next().remove()
}, 1000)
return false;
}
//处理用户请求 ajax
if (flag == true) {
$.get('0413_2.php', {
rows: $('input[name = "rows"]').val(),
cols: $('input[name = "cols"]').val(),
name: $('input[name = "name"]').val()
}, function (data) {
$('p:last').next().remove()//用于清理上一个表格的内容
$('p:last').after(data)
flag = false;
})
}
})
})
$('button').eq(1).click(function () {
$(':input').not('button').val('')
$(':input:first').focus()
$('p:last').next().remove()
flag = true
})
</script>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
实例 PHP
<?php
if ($_SERVER['REQUEST_METHOD'] == 'GET') {
if (!empty($_GET['rows']) && !empty($_GET['cols'])) {
$rows = $_GET['rows'];
$cols = $_GET['cols'];
$name = $_GET['name'];
$table = '<table border="1" cellspacing="0" cellpadding="3" align="center" width="80%" >';
$table .= '<tr align="center" bgcolor="blue" >';
$table .= '<th colspan='.$cols.'>'.$name.'</th>';
$table .= '</tr>';
// echo $table;
for ($g = 0; $g < $rows; $g++) {
for ($f = 0; $f < $cols; $f++) {
$df = $g*$cols+$f;
$table .= '<td align="center">'.++$df.'</td>';
}
$table .='</tr>';
}
$table .= '<table>';
echo $table;
}
} else {
exit('<span >非法请求</span>');
}
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/运行实例 »
点击 "运行实例" 按钮查看在线实例
