permintaan pencarian ajax

Penulis：Eve Cole Waktu Pembaruan：2009-06-07 14:56:52

Tabel database: Salin konten ke kode clipboard:

CREATE TABLE `xqbar`.`suggest` (
`id` INT BUKAN NULL AUTO_INCREMENT ,
`judul` VARCHAR( 100 ) BUKAN NULL ,
`menekan` INT BUKAN NULL DEFAULT '0',
KUNCI UTAMA (`id`)
) ENGINE = InnoDB

masukkan ke dalam saran(judul,hits)nilai('xqbar.com',100);
masukkan ke dalam saran(judul,hits)nilai('www.xqbar.com',410);
masukkan ke dalam saran(judul,hits)nilai('http://xqbar.com',700);
masukkan ke dalam saran(judul,hits)nilai('mail:xqbar.com',200);
masukkan ke dalam saran(judul,hits)nilai('ftp:xqbar.com',100);
masukkan ke dalam saran(judul,hit)nilai('http://www.xqbar.com',70)search.php
(Saya sudah lama tidak mengenal PHP. Jika PHP di bawah ini terlalu bertele-tele, saya ingin saran dari ahlinya)
String informasi yang dikembalikan harus xxx1|xxx2$200|100. Konten salinan yang sesuai ke kode clipboard sebelum dan sesudah:

<?php
if($_GET["tindakan"]!=''){
#Dapatkan kata kunci yang dimasukkan oleh pengguna
$kata kunci=$_GET["kata kunci"];
#Filter kata kunci
$kata kunci=str_replace("[","[[]",$kata kunci);
$kata kunci=str_replace("&","[&]",$kata kunci);
$kata kunci=str_replace("%","[%]",$kata kunci);
$kata kunci=str_replace("^","[^]",$kata kunci);
#Tautan basis data
$sambungan=mysql_connect("localhost","xqbar","xqbaradmin");
#Pilih basis data
@mysql_select_db("xqbar") atau die('maaf');
mysql_query('tetapkan nama utf-8');
#pernyataan kueri
$sql="pilih judul, klik dari saran di mana judul seperti '%".$kata kunci."%' diurutkan berdasarkan hits batas desc 10";
$hasil=mysql_query($sql);
#Loop untuk mendapatkan hasil kueri dan mengembalikan string
#Formatnya adalah Hasil 1|Hasil 2$Jumlah klik Hasil 1|Jumlah klik Hasil 2
jika($hasil){
$i=1;$judul='';$hit='';
while($baris=mysql_fetch_array($hasil,MYSQL_BOTH))
{
$judul=$judul.$baris['judul'];
$hit=$hit.$baris['hit'];
if($i<mysql_num_rows($hasil))
{
$judul=$judul."|";
$hit=$hit."|";
}
$i++;
}
}
mysql_close();
}
?>
<?php echo $title.'$'.$hits;?>kode js untuk menyalin konten ke kode clipboard:

Setelah memperkenalkan prototye.js, beberapa teman mengatakan bahwa perpustakaan ini terlalu besar, atau jika Anda tidak terbiasa, Anda dapat menggunakan kerangka jquery.js atau langsung membuat objek ajax Disini saya langsung mengutip framework prototye.js.
<skrip type="teks/javascript" src="prototype.js"></skrip>
kode js untuk membuat lapisan dan menampilkan hasil query
<skrip tipe="teks/javascript">
//Tentukan variabel lastindex untuk mewakili posisi di mana mouse menggeser hasil query, awalnya -1
var indeks terakhir=-1;
//Tentukan tanda variabel untuk menunjukkan apakah akan melakukan kueri ajax berdasarkan kata kunci yang dimasukkan oleh pengguna. false berarti kueri diperbolehkan dan true berarti kueri dilarang.
var bendera=salah;
//Panjang array yang dihasilkan oleh hasil kueri yang dikembalikan
var panjang daftar=0;
//Buat string khusus untuk mengoptimalkan efisiensi
fungsi StringBuffer(){ini.data=[];}
//penugasan
StringBuffer.prototype.append=function(){this.data.push(arguments[0]);kembalikan ini;}
//Keluaran
StringBuffer.prototype.tostring=function(){kembalikan this.data.join("");}
//Hapus spasi di kedua sisi string
String.prototype.Trim = function(){kembalikan ini.replace(/(^s*)|(s*$)/g, "");}
//Fungsi tersembunyi terutama untuk menyembunyikan lapisan drop-down prompt yang ditampilkan dan iframe.
fungsi pencarian tersembunyi()
{
$('rlist').style.display="tidak ada";
$('rFrame').style.display="tidak ada";
}
//Fungsi tampilan terutama menampilkan lapisan drop-down prompt dan nomor parameter iframe. Menurut parameter ini, ketinggian lapisan prompt dan iframe yang akan ditampilkan dikontrol.
fungsi pencarian pertunjukan (angka)
{
$('rlist').style.display='';
$('rFrame').style.display='';
//Di sini saya mendefinisikan tinggi prompt dari setiap hasil kueri yang dikembalikan sebagai 20px, dan tinggi total lapisan prompt ditambahkan ke num karena saya menggunakan padding satu piksel saat mendefinisikan gaya.
$('rlist').style.height=angka*20+angka+'px';
//Juga posisikan ketinggian iframe
$('rFrame').style.height=angka*20+angka+'px';
}
//Mengembalikan fungsi koordinat kotak masukan teks. Elemen parameter adalah objek yang akan dikembalikan. Parameter offset dapat berupa offsetLeft|offsetTop, yang masing-masing mewakili posisi absolut objek dari sudut atas jendela kiri.
//www.devdao.com Gunakan fungsi ini untuk mencari layer prompt yang ingin kita tampilkan, sehingga layer prompt ditampilkan dengan benar di bawah kotak input teks
fungsi getposition(elemen,offset)
{
var c=0;
sementara (elemen)
{
c+=elemen[offset];
elemen=elemen.offsetParent
}
kembali c;
}
//Fungsi untuk membuat layer prompt menyertakan layer prompt dan untuk menghindari munculnya kotak drop-down pilih di bawah kotak input teks, layer prompt kita tidak dapat lagi memilih iframe di atasnya.
//Dapat dipahami bahwa ketika ada kotak drop-down pilih di bawah kotak input teks, itu adalah lapisan drop-down box-iframe-prompt pilih dari bawah ke atas.
daftar pembuatan fungsi()
{
//Buat lapisan prompt
var listDiv=document.createElement("div");
//Meminta id lapisan
listDiv.id="rlist";
listDiv.style.zIndex="2";
listDiv.style.position="mutlak";
listDiv.style.border="1px padat #000000";
listDiv.style.backgroundColor="#FFFFFF";
listDiv.style.display="tidak ada";
listDiv.style.width=$('kata kunci').clientWidth+"px";
listDiv.style.left=getposition($('keyword'),'offsetLeft')+1,5+"px";
listDiv.style.top =(getposition($('keyword'),'offsetTop')+$('keyword').clientHeight +3)+"px";

<form id="form1" name="form1" method="post" action="">
<b>Masukkan kata kunci pencarian</b>
<masukan nama="kata kunci" type="teks" class="inputblue" id="kata kunci" maxlength="20" style="lebar:300px;"
</bentuk>