div doğru sorun jquery ekleme değil

1 Cevap php

Ben doğru alanında bir <div> öğe ekleyerek bir sorun sahip gibi görünüyor. Ben bu durumda "daha fazla bilgi" de, bir düğmeye basın ve jquery kullanarak ilk div alanının altında daha fazla bilgi görüntülemek istiyorum.

Örnek:

<div id="Main-info">
     <div id="more-info">

     </div> 
</div>

Ben yaşıyorum sorun "Ana-info" alan bir php dosyası arayarak ve veritabanından bilgi kapma ve bir tablo içinde görüntüleyerek olduğunu. Ben, "Daha fazla bilgi" yükleri div var bu yüzden daha fazla bilgi düğmesine bastığınızda ikinci php dosyaları tüm ilk div altında gidiyor ama ben onu istiyorum ikinci php dosyası Ben tıklayın belirli bilgileri altında gitmek.

Ben başarmak için çalışıyorum ne daha iyi bir örnek sağ tıklayabilirsiniz bilgi altında daha fazla bilgi düğmesini ve daha fazla bilgi ekranı itmek wefollow.com site gibi. Benim durumumda ek bilgi hasebiyle tüm tablo altında gider.

İşte kod:

index.php:

<?php
include("buy.functions.php");
?>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="listing.js"></script>

    <div id="article-area">
    	<h1>Welcome</h1>
    <div id="output-listings">
            <div id="more-information">

            </div>
    <?php outputListingsTable(); ?>

    </div><!--end output-listings-->

buy.functions.php:

<?php
function outputListingsTable()
{
    $mysql = new mysqli('localhost', 'root', 'root', 'ajax_demo') or die('you\'re dead');
    $result = $mysql->query("SELECT * FROM explore") or die($mysql->error);

    if($result) 
    {
    	echo "<table> \n";

    	while($row = $result->fetch_object()) 
    	{
    		$id = $row->id;
    		$siteName = $row->site_name;
    		$siteDescription = $row->site_description;
    		$siteURL = $row->site_url;
    		$sitePrice = $row->site_price;

    		echo "<div id=\"" . $id . "\"> \n";
    		echo "	<tr> \n";
    		echo "	 	<td>" . $siteName . "</td> \n";
    		echo "		<td>" . $siteURL . "</td> \n";
    		echo "		<td><a id=\"" . $id . "\" class=\"more-info\" href=\"#\">More info</a></td> \n";			
    		echo "	</tr> \n";
    		echo "</div> \n";			
    	}

echo "</table> \n";
    }

}

?>

getinfo.php:

<?php
function outputDescriptionTable($id)
{
    $mysql = new mysqli('localhost', 'root', 'root', 'ajax_demo') or die('you\'re dead');	
    $result = $mysql->query("SELECT * FROM explore WHERE id=" . $id) or die($mysql->error);

    if($result) 
    {
    	echo "<table> \n";

    	while($row = $result->fetch_object()) 
    	{
    		$siteName = $row->site_name;
    		$siteDescription = $row->site_description;
    		$siteURL = $row->site_url;
    		$sitePrice = $row->site_price;

    		echo "<div id=\"more-information\"> \n";
    		echo "	<tr> \n";
    		echo "		<td>" . $siteDescription . "</td> \n";
    		echo "		<td>" . $sitePrice . "</td> \n";
    		echo "	</tr> \n";
    		echo "</div> \n";			
    	}

echo "</table> \n";
    }

}
?>
    <?php $id = $_GET['id']; ?>
    <?php outputDescriptionTable("$id"); ?>

listing.js:

$(function(){
$("tr").hover(function(){
	$(this).addClass("hover");
}, function() {
	$(this).removeClass("hover");
});

$('.more-info').click(function() {
$('#more-information').show().load('getinfo.php?id=' + $(this).attr('id'));
return false;
});
});

1 Cevap

jQuery closest sorunu çözmek gerekir. Gibi bir şey:

$('.more-info').click(function(e) {
    $(e.target).closest('.more-information').show().load('getinfo.php?id=' + $(this).attr('id'));
    return false;
});

Doc:

Closest works by first looking at the current element to see if it matches the specified expression, if so it just returns the element itself. If it doesn't match then it will continue to traverse up the document, parent by parent, until an element is found that matches the specified expression. If no matching element is found then none will be returned.

Kimliği aksine kimlikleri garip şeyler olabilir başka, benzersiz olması gerektiği gibi Ayrıca, 'fazla-bilgi' divs, class daha fazla-bilgi sahibi olmalıdır.

etiketler