以下是一个例子:
html文件suggest.html:
<html>
<head>
<meta http-equiv="content-type" content="text/htmlcharset=UTF-8">
<script language="JavaScript" type="text/javascript" src="ajax_search.js"></script>
<style type="text/css" media="screen">
body {
font: 11px arial
}
.suggest_link {
background-color: #FFFFFF
padding: 2px 6px 2px 6px
cursor:hand
}
.suggest_link_over {
background-color: #E8F2FE
padding: 2px 6px 2px 6px
}
#search_suggest {
position:relative
background-color: #FFFFFF
text-align: left
border: 1px solid #000000
left: -12px
top: 1px
height: 74px
width: 170px
display:none
}
</style>
</head>
<body background="bg.gif">
<center>
<h3>实现搜索提示</h3>
<div style="width: 500px">
<input type="text" id="txtSearch" name="txtSearch" onKeyUp="searchSuggest()" autocomplete="off" />
<input type="submit" id="cmdSearch" name="cmdSearch" value="搜索"/><br />
<div id="search_suggest"></div>
</div>
</center>
</body>
</html>
ajax_search.js:
var searchReq = createAjaxObj()
function createAjaxObj()
{
var httprequest=false
if (window.XMLHttpRequest) //为非IE浏览器生成XmlHttpRequest对象
{
httprequest=new XMLHttpRequest()
if (httprequest.overrideMimeType) httprequest.overrideMimeType('text/xml')
}
else if (window.ActiveXObject) //为IE浏览器生成XmlHttpRequest对象
{
try
{
httprequest=new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e)
{
try
{
httprequest=new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
return httprequest
}
function searchSuggest()
{
if (searchReq.readyState == 4 || searchReq.readyState == 0)
{
一般富文本编辑器保存的文章排版都是添加了跟多html或者css代码保存到数据库的,为就是后台预言可以直接从数据库中取出来放到html页面显示那些样式和排版,此时后台读取到带有html标记的数据应该是交给JavaScript,使用JavaScript的一些方法将数据展现在页面上输出。
工具原料:jQuery、编辑器、浏览器
1、首先假设后台读取到的数据通过ajax传给了前端的JavaScript,JavaScript获取的数据后使用html方法将其输出在页面的某个标签中,在这里我们使用模拟数据来代替数据的传输过程,代码如下:
<body><script src="libs/jquery/2.1.4/jquery.js"></script>
<div id="div1">
</div>
<script>
var data="<font color='red'>测试数据</font>"//带有html标签的测试数据
$('#div1').html(data)//通过html()方法将数据输出到div中
</script>
</body>
2、运行的效果如下图:
<?php require_once("mysql_class.php")require_once("sys_conf.inc")
header('Content-Type:text/htmlCharset=GBK')
$link_id=mysql_connect($DBHOST,$DBUSER,$DBPWD)
mysql_select_db($DBNAME) //选择数据库my_chat
$sql="SELECT * FROM `dx_leibie`"
$query = mysql_query($sql)
while($row=mysql_fetch_array($query)){
//print_r($row) //$con=array(array('新闻标题','新闻内容'),array('新闻标题2','新闻内容2')) $title=$row[id_lang]
$content=$row[name]
if(!is_dir("up")) //如果此文件夹不存在,则自动建立一个
{
mkdir("up")
}$up="up/"
echo $path=$up.$row[id_lang].'.htm'
$fp=fopen("tmp.htm","r")//只读打开模板
$str=fread($fp,filesize("tmp.htm"))//读取模板中内容
$str=str_replace("{title}",$title,$str)
echo $str=str_replace("{content}",$content,$str)//替换内容
fclose($fp) $handle=fopen($path,"w")//写入方式打开新闻路径
fwrite($handle,$str)//把刚才替换的内容写进生成的HTML文件
fclose($handle)
//echo "生成成功"
} // unlink($path)//删除文件
?><?php require_once("mysql_class.php")
require_once("sys_conf.inc")
header('Content-Type:text/htmlCharset=GBK')
$link_id=mysql_connect($DBHOST,$DBUSER,$DBPWD)
mysql_select_db($DBNAME) //选择数据库my_chat
$sql="SELECT * FROM `dx_leibie`"
$query = mysql_query($sql)
while($row=mysql_fetch_array($query)){
//print_r($row) //$con=array(array('新闻标题','新闻内容'),array('新闻标题2','新闻内容2')) $title=$row[id_lang]
$content=$row[name]
if(!is_dir("up")) //如果此文件夹不存在,则自动建立一个
{
mkdir("up")
}$up="up/"
echo $path=$up.$row[id_lang].'.htm'
$fp=fopen("tmp.htm","r")//只读打开模板
$str=fread($fp,filesize("tmp.htm"))//读取模板中内容
$str=str_replace("{title}",$title,$str)
echo $str=str_replace("{content}",$content,$str)//替换内容
fclose($fp) $handle=fopen($path,"w")//写入方式打开新闻路径
fwrite($handle,$str)//把刚才替换的内容写进生成的HTML文件
fclose($handle)
//echo "生成成功"
} // unlink($path)//删除文件
?><?php require_once("mysql_class.php")
require_once("sys_conf.inc")
header('Content-Type:text/htmlCharset=GBK')
$link_id=mysql_connect($DBHOST,$DBUSER,$DBPWD)
mysql_select_db($DBNAME) //选择数据库my_chat
$sql="SELECT * FROM `dx_leibie`"
$query = mysql_query($sql)
while($row=mysql_fetch_array($query)){
//print_r($row) //$con=array(array('新闻标题','新闻内容'),array('新闻标题2','新闻内容2')) $title=$row[id_lang]
$content=$row[name]
if(!is_dir("up")) //如果此文件夹不存在,则自动建立一个
{
mkdir("up")
}$up="up/"
echo $path=$up.$row[id_lang].'.htm'
$fp=fopen("tmp.htm","r")//只读打开模板
$str=fread($fp,filesize("tmp.htm"))//读取模板中内容
$str=str_replace("{title}",$title,$str)
echo $str=str_replace("{content}",$content,$str)//替换内容
fclose($fp) $handle=fopen($path,"w")//写入方式打开新闻路径
fwrite($handle,$str)//把刚才替换的内容写进生成的HTML文件
fclose($handle)
//echo "生成成功"
} // unlink($path)//删除文件
?>用以上先生成一个HTML文件,然后再用require_once("aaa.html")引进来就OK
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)