如何用html和js向table添加多条数据后与主表一起提交到数据库

1、需要写界面的时候需要实现——通过点击一个button让table增加一行（和前面行内的内容一致，无论是dropdown还是checkbox）。

2、步骤是这样的：

在script里面写一个Function如下。

   直接通过<input type="button" value="More" name="More" class="sb" style="width:40px" onclick="addRow()" />调用它的onclick事件，onclick="addRow()"即可以实现需求。

使用mysql函数mysqli函数连接 *** 作数据可即可，或者使用PDO

使用mysqli步骤：

1. 连接MySQL数据库

2. 判断是否连接成功

3. 选择数据库

（前三步可简写成：$link = @mysqli_connect('localhost', 'root', '', 'lx') or exit('数据库连接失败')）

4. 设置字符集

5. 准备SQL语句

6. 向MySQL服务发送SQL语句

7. 解析处理结果集

8. 释放结果集，关闭数据库连接

案例：

<?php

header('Content-type:text/htmlcharset=utf-8')

//1.连接数据库服务器  mysqli  mysql -u root -p

$link = @mysqli_connect('localhost','root','')

//var_dump($link)

//2.判断连接是否成功  信息提示GBK编码

if(mysqli_connect_errno()){

exit('数据库连接失败原因：'.mysqli_connect_error())

}

//3.选择数据库  连接标识  数据库名称

if(!mysqli_select_db($link, 'wz')){

exit('数据库选择失败')

}

//4.设置字符集

mysqli_set_charset($link, 'utf8')

//5.准备SQL

$username = 'zhangsan'

$password = md5('12345')

$pic = '32545.jpg'

$sql = "insert into user2(uname,password,pic) values('{$username}','{$password}','{$pic}')"

/* echo $sql

exit */

//6.执行SQL

$res = mysqli_query($link, $sql)

//7.判断执行结果

if($res){

//成功

echo '成功'

}else{

//失败

echo '失败'

}

//8.关闭数据库连接

mysqli_close($link)

HTML5连接数据库分为以下几步：

预备知识：Web SQL Database，Html5环境下可以用Js执行CRUD的Web数据库组件。

核心方法如下：

1、openDatabase：这个方法使用现有数据库或创建新数据库创建数据库对象。

2、transaction：这个方法允许我们根据情况控制事务提交或回滚。

3、executeSql：这个方法用于执行真实的SQL查询。

第一步：打开连接并创建数据库

var dataBase = openDatabase("student", "1.0", "student", 1024 * 1024, function () { })

if (!dataBase) {

alert("数据库创建失败！")

} else {

alert("数据库创建成功！")

}

第二步：创建数据表

this.createTable=function() {

dataBase.transaction( function(tx) {

tx.executeSql(

"create table if not exists stu (id REAL UNIQUE, name TEXT)",

[],

function(tx,result){ alert('创建stu表成功')},

function(tx, error){ alert('创建stu表失败:' + error.message)

})

})

}

第三步：执行增删改查

添加数据：

this.insert = function () {

dataBase.transaction(function (tx) {

tx.executeSql(

"insert into stu (id, name) values(?, ?)",

[id, '徐明祥'],

function () { alert('添加数据成功')},

function (tx, error) { alert('添加数据失败: ' + error.message)

} )

})

---