ajax怎么实现向数据库添加数据?

ajax怎么实现向数据库添加数据?,第1张

ajax主要是用来实现异步 *** 作的,ajax会向一个可以 *** 作数据库的脚本语言(例如php)文件发出请求,同时传递参数和数据,在php文件中,通过插入数据库的代码,实现添加数据,然后返回成功的标志,ajax就根据这个标志来判断是否成功。

<select class="dosm">

</select>

<script>

        //这里用到了JQuery

    $.ajax({

        url:"请求的url路径",

           type:"post",  //post请求

           data: {}   //  后台请求数据

           success:function(data){

                //请求成功之后填充数据

//可以把data看成一个数组

                for(var i =0i<data.lengthi++){

                    $(".dosm").append("<option>" + data[i]+ "</option>")

                }

            }

    })

</script>

大概的处理思路应该是这样的: 先通过AJAX,从服务器端的某个文件取得这段js代码,然后动态创建一个<script>标签,把取得js代码字串写入到<script>标签里就可以了!

这边有个小问题,不知道你取得代码为什么要包含<script>标签 ,这样我动态创建<script>标签时,还需要在字串里把<script language=javascript>跟</script>去掉才行。

先按照你返回的代码的样式,用js处理一下吧,测试代码如下:

<html>

<head>

<script language="javascript">

function window_load(){

getAndRunScript("test.js",true,processScriptBeforeRun)

}

/*

加载并执行指定文件中的代码,参数:

*/

function getAndRunScript(url,async,process,callback){

var r = createXmlHttpRequest()

//初始化XMLHttpRequest组件

r.open("get",url,async)

//发送请求

r.send(null)

//将取得的js代码添加到画面的script标签里

appendScript(process ? process(r.responseText) : r.responseText )

callback &&(callback(codes))

}

//XmlHttpRequest对象

function createXmlHttpRequest(){

if(window.ActiveXObject){ //如果是IE浏览器

return new ActiveXObject("Microsoft.XMLHTTP")

}else if(window.XMLHttpRequest){ //非IE浏览器

return new XMLHttpRequest()

}

}

//创建一个新的script标签,并将指定的js代码写入到标签内

function appendScript(codes){

//创建script标签

var s = document.createElement("<script type='text/javascript'>")

s.text = codes

var head = document.getElementsByTagName("head")[0]

head.appendChild(s)

}

//去除script代码字串中的script标签

function processScriptBeforeRun(script){

return script.replace(/<[^>]+>/g,"")

}

</script>

</head>

<body onload="window_load()">

<input type="text" id="text1">

</body>

</html>

这个是用javascript + XMLHttpRequest来实现的。

其实如果你返回的代码里不包含<script>标签的话(就像普通的js文件里的内容就行),你可以直接用jQuery的getScript方法就行了:

<html>

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script language="javascript">

$(document).ready(function(){

// 用jQuery的getScript方法,则js代码字串不能带有<script>标签,否则无法执行

$.getScript("./test.js")

})

</script>

</head>

<body >

<input type="text" id="text1">

</body>

</html>

最后把我测试用的代码放到附件里.. 你自己测测看,看是不是你想要的那种方式吧!


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11665346.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-17
下一篇2023-05-17

发表评论

登录后才能评论

评论列表(0条)

    保存