2014-02-19 51 views
0

我想實現這樣的效果,除了當你點擊圖片(鏈接)jQuery腳本的事實發送GET到同一個文件與另一個ID。我的意思是動態重新加載頁面,而不會在附加鏈接中刷新附加效果。PHP數據庫,jQuery的動態內容加載

我的代碼:

<script> 
$('a.menu').click(function(){ 
    $('.content').html(''); 

}) 
</script> 

<div class="content" id="page_effect" style="padding:0px; display:none;"> 
<div class="separator" style="margin: -17px auto;"></div> 
<span class="choose-product"> Wybierz Produkt</span> 

<p> 
<?php 
$kat=$_GET['kat']; 
$co_ile_strona=9; 
//---------------- 

$dopisz=""; 

if (is_numeric($kat)) { 

$dopisz=" WHERE kat_id='".$kat."'"; 
$wyk=mysql_query("SELECT * FROM kategorie WHERE kat='".$kat."'"); 
while($ww=mysql_fetch_array($wyk)) { 
$dopisz.=" OR kat_id='".$ww['id']."'"; 
} 

} 

$sile=false; 
$wyk=mysql_query("SELECT * FROM produkty ".$dopisz.""); 
if ($ile=mysql_num_rows($wyk)) { 

if (!$sile) { 

$nazwa = mysql_fetch_assoc(mysql_query("SELECT * FROM kategorie WHERE id='".$_GET['kat']."'")); 
if(strlen($nazwa['nazwa']) > 0) 
$nazwa = $nazwa['nazwa']; 
?> 


<div style="text-align: center; width: 80%;margin: 0 auto;margin-top: 39px;"> 
    <a href="produkt.html"><div class="product-box"> 
     <img src="images/picasso0.png" alt="Product"/> 
     <span class="product-title"><?=$nazwa?></span> 
    </div> 
    </a> 

    <? 
$sile=true; 
} 
if (!$_GET['strona']) $strona=1; else $strona=$_GET['strona']; 
$start=($strona*$co_ile_strona)-$co_ile_strona; 
mysql_data_seek($wyk,$start); 
$licz=0; 

while(($ww=mysql_fetch_object($wyk)) && $licz<$co_ile_strona) { $licz++; 
?> 
    <a href="<?=strtolower(seo($ww->nazwa))?>-<?=$ww->id?>p.html"><div class="product-box"> 
     <img src="produkty/front/<?=$ww->front?>" alt="<?=$ww->nazwa?>"/> 
     <div class="name2"><span><?=$ww->nazwa?> </span></div> 
    </div> 
    </a> 
<? 
} 
} else echo "<span style='color: #ff0000; font-size: 12pt; font-weight: bold;'>Przepraszamy, ale nie znaleziono produktów pasujących do tego zapytania</span>"; 
?> 

</div> 
    <div class="menu-bottom" style="text-align:center;"> 
     <span style="position: relative;top: 25px;display: inline-flex;margin-bottom: 20px;">Wybierz serię: 
     <ul> 
<?php 
$zapas=$_GET['kat']; 
$wyk=mysql_query("SELECT * FROM kategorie WHERE kat='0' and wid='1' ORDER BY poz ASC"); 
while($ww=mysql_fetch_object($wyk)) { 
?> <!--<?/*=$ww->nazwa?>-<?=$ww->id*/?>k.html*/--> 
<li> <a href="<?=$ww->id;?>" class="menu" title="<?=$ww->nazwa?>"><? if($_GET['kat']==$ww->id) echo "<span style='color: #000;'>".$ww->nazwa.""; else echo $ww->nazwa?></a></li> 
<? } ?> 
     </ul> 
    </span> 
    </div> 

    <!-- end .content --></div> 

鏈接:Click here

+0

看看了'得到()'或'後()'jQuery的功能。備註:不要使用mysql_,而應使用mysqli_或PDO;你的命名約定很糟糕。儘量不要混用英語和波蘭語,我會推薦使用英語。 –

+0

感謝Adnrzej您resposne,我只需要更改這個代碼,我總是用英語可變:) Dzięki安傑ZAodpowiedź。 Zawszeużywamangielskich nazw zmiennych。 Wiem JAKużywaćposta請我木屐W¯¯JS,強麥zawsze到SIEwiąże,Zprzeładowaniemstrony :( – Kubol

+0

讓我們更好地使用英語:)'得到()'或'後()'jQuery函數不會導致頁面重新加載。讓我準備一個答案。 –

回答

0

正如評論所說,你應該送一個AJAX請求到負責處理數據庫任務的頁面。您可以使用get()post()函數,它是AJAX功能的簡寫爲jQuery documentation規定。

$.ajax({ 
    url: url, 
    data: data, 
    success: success, 
    dataType: dataType 
}); 

我已經準備了一個簡單的演示jsFiddle任務如何才能實現(請注意event.preventDefault()call):

$(document).ready(function(){ 
    $("button").click(function(e){ 
     var URL = ''; 
     $.get(URL,function(data){ 
     console.log("Status: " + status); 
     e.preventDefault(); 
    }); 
    }); 
}); 

希望有所幫助。