PDA

View Full Version : مشکل کد ایجاد و از بین بردن دایو باهم؟


armintirand
شنبه 26 فروردین 1391, 18:28 عصر
سلام من یک صفحه دارم که میخوام توش ۴تاقسمت دارم که میخوام با کلیک روی هر قسمت یک دایو باز بشه و با کلیک روی قسمت دیگه اول اون دایو قبلی ازبین بره و بعد دایو جدیدی درون اون دایوی که کلیک شده ساخته بشه.خودم یکچیزایی نوشتم ولی چون تازه دارم doom کار میکنم و همزمان اجکس نتونستم ایمکارو انجام بدم توی سایتها هم فقط شده استفاده از جی کوئری.در صورت امکان برام یک مثال کوچیک بزنید.
ممنون
armintirand
دوشنبه 28 فروردین 1391, 22:43 عصر
این کدهارو خودم نوشتم ولی کارنمیکنه
کد اول از یک کلاس php مشتق شده و فقط میخوام با کلیک روی تگهای <li> مقدار css دایو درون آن مقدار display آنرا از none به block تغییر بده و بعد متن مورد نطر رو با ajax بگیرم و توی دایو زیری نشون بدم حالا کدهای منو بررسی کنید و در صورت امکان اشکالاتم رو برطرف کنید با تشکر.
کد اول :
<?php
include "page.php";
//echo 'aa';
class about extends Page
{
public function Display()
{
echo '<html><head>';
$this->DisplayTitle();
$this->DisplayKeywords();
$this->DisplayIcon();
$this->DisplayStyle();
echo '</head><body>';
$this->DisplayHeader();
$this->DisplayMenue($this->buttons);
$this->DisplaySidebar();
$this->DisplayContent();
$this->DisplayFooter();
echo '</body></html>';
}
public function DisplayStyle()
{
?>
<link rel="stylesheet" href="style/style.css" type="text/css" />
<script src="slidshow.js" type="text/javascript"></script>
<script src="../lib/showhide.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?php
}
public function DisplayContent()
{
echo '<table id="new"><tr><td><p>محصولات</p>
<li><a href="#" onclick="showhide(this)"/> تجهیزات روشنایی</a><div id="noshow" >aaaa</div> </li>

<li><a href="#" onclick="showhide(this)"/> تجهیزات ترافیکی </a><div id="noshow1" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> مبلمان اداری </a><div id="noshow2" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> مبلمان شهری </a><div id="noshow3" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> مالچ ارگانیک رنگی </a><div id="noshow4" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> اجرای خدمات ساختمانی </a><div id="noshow5" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> مجموعه بازی </a><div id="noshow6" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> چمن </a><div id="noshow7" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/>تجهیزات بیمارستانی</a><div id="noshow8" >aaaa</div></li>

<li><a href="#" onclick="showhide(this)"/> اجرا و ساخت انواع سازه‌های فلزی </a><div id="noshow9" >aaaa</div></li>

</td></tr></table>
<marquee scrollamount="2" direction="right">وبسایت اروم ساحل در حال
بروزرسانی می
باشد</marquee></p>';
}
}
$homepage = new about();
$homepage->Display();
?>
تابع جاوااسکریپتی مورد نظر که کارنمیکنه:
function showpost(di)
{
di.ChildNode[0].style.display='block';
}
ممنون
MMSHFE
سه شنبه 29 فروردین 1391, 00:06 صبح
این نمونه رو ببینید:


<!doctype html>
<html>
<head>
<title>JS Test</title>
<meta charset="utf-8"/>
<script type="text/javascript">
function hide() {
var divs = document.getElementsByTagName('div');
for(var i = 0; i < divs.length; i++) {
divs[i].style.display = 'none';
}
}
function showhide(item) {
item.nextSibling.style.display = (item.nextSibling.style.display == 'none' ? '' : 'none');
}
</script>
</head>
<body onload="hide();">
<table id="new">
<tr>
<td>
<p>محصولات</p>
<li><a href="#" onclick="showhide(this);"/>تجهیزات روشنایی</a><div id="noshow">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>تجهیزات ترافیکی</a><div id="noshow1">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>مبلمان اداری</a><div id="noshow2">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>مبلمان شهری</a><div id="noshow3">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>مالچ ارگانیک رنگی</a><div id="noshow4">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>اجرای خدمات ساختمانی</a><div id="noshow5">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>مجموعه بازی</a><div id="noshow6">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>چمن</a><div id="noshow7">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>تجهیزات بیمارستانی</a><div id="noshow8">aaaa</div></li>
<li><a href="#" onclick="showhide(this);"/>اجرا و ساخت انواع سازه‌های فلزی</a><div id="noshow9">aaaa</div></li>
</td>
</tr>
</table>
<marquee scrollamount="2" direction="right">وبسایت اروم ساحل در حال بروزرسانی می باشد</marquee></p>
</body>
</html>
امیدوارم مشکلتون رفع شده باشه. موفق باشید.
armintirand
سه شنبه 29 فروردین 1391, 21:45 عصر
سلام
کد شما خیلی بدردم خورد
کمی تغییرش دادم اول تابع showhide تابع hide رو فراخوانی کردم با اینکار روی هر لینک که کلیک میشه اول همه دایوها مخفی میشه بعد دایو مورد نطر نمایان میشه.
اما قسمت ajax برنامه کمی برام میلنگه.میخوام آخر تابع showhide تابع getData رو برای قسمت ajax فرخوانی کنم فقط مشکلم بازم فراخوانی تابع با آرگومان id مورد نطر هست البته کل کار اینه که روی هرقسمت که کلیک میشه باید از دیتابیس چند تا عنوان رو بگیرم و توی li های زیرین قرار بدم و دوباره اگه روی هر کدوم کلیک شد برای هر کدوم از دیتابیس توضیحات و عکس مربوطه رو نشان بده.فعلا همون فراخوانی تابع با آرگومان id مورد نطر رو کمک کنید تا بعدش اگه تو روند کار مشکلی داشتم از کمک عزیزی مثل شما بهرمند بشم.
ممنون
MMSHFE
چهارشنبه 30 فروردین 1391, 10:40 صبح
خوب دوست عزیز، نیازی نیست که id رو براش بفرستین. کافیه توی تابع با استفاده از ("item.getAttribute("id خصوصیات id عنصری که ارسال شده رو بدست بیارین. راستی، این دکمه تشکر هم کاربرد جالبی داره، مگه نه؟ :چشمک:
armintirand
پنج شنبه 31 فروردین 1391, 02:11 صبح
من کدمو با کمک شما کمی ارتقا دادم اما الان که میخوام قسمت ajax برناممو بسازم کمی مشکل داره فایل showhide.js رو به شکل زیر آپدیت کردم
function getData(dataSource, divID)
{

var XMLHttpRequestObject = false;
if (window.XMLHttpRequest){
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

if(XMLHttpRequestObject){
var obj = document.getElementById(divID);
XMLHttpRequestObject.open("GET", dataSource);

XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 &&
XMLHttpRequestObject.status == 200){
obj.innerHTML = XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.send(null);
}
}
function hide(){
var divs = document.getElementsByTagName('div');
for(var i = 0; i < divs.length; i++) {
divs[i].style.display = 'none';}
}
function showhide(item){
hide();
item.nextSibling.style.display = (item.nextSibling.style.display == 'none' ? '' : 'none');
aa=item.nextSibling.getAttribute("id");
getData('data.txt',aa);
}
شی xmlhttp ساخته میشه ولی از قسمت XMLHttpRequestObject.readyState به بعد دیگه کارنمیکنه.
راستی دکمه تشکر برای شما خیلی کمه گفتم شاید بی ادبی باشه برای کمکهای شما فقط از دکمه تشکر استفاده کنم.
ممنون