رفرش صفحه بدون ری لودینگ صفحه [بایگانی]

amaa_tama

پنج شنبه 20 شهریور 1393, 13:56 عصر

با سلام
دوستان من یک صفحه php دارم که اطلاعات موجود در آن توسط یک کد یک خطی php نمایش داده میشه . و من این صفحه رو با یک آی فریم در یک جایی از سایتم ( تحت وردپرس ) نمایش میدم .
حالا چندین وقتی هست که به دنبال کدی هست که کل اطلاعات موجود در صفحه رو مثلا هر 3 ثانیه رفرش کنه و در نتیجه در فریم هم عوض بشه یا بشه هر 3 ثانیه آدرس آی فریم رو عوض کنم تا مورد نمایش داده شده هم عوض بشه .
در اینترنت کلی کد پیدا کردم تست کردم ولی هیچ کدوم درست نبودند و موقع رفرش صفحه در مرورگر کاربر هم رفرش میشد و این اصلا خوب نیست . متا تگ رفرش و کد جاوا اسکریپت رفرش رو هم تست کردم ولی گویا با جی کوئری مشکلم حل میشه ولی متاسفانه هیچ نمونه کدی پیدا نکردم .
دوستان عزیز کمکم کنید .
با تشکر

FastDesign.ir

پنج شنبه 20 شهریور 1393, 15:13 عصر

با سلام خدمت شما دوست گرامی
ابتدا کتابخانه jquery را از آدرس زیر دریافت کنید.
http://code.jquery.com/jquery-1.6.4.min.js

بعد از اضافه کردن کتابخانه jquery به صفحه ای که iframe وجود دارد از کد زیر برای بارگذاری مجدد iframe به ازای هر 3 ثانیه استفاده کنید.
(http://www.example.com آدرس صفحه شماست)

$(function () {
setInterval(function () {
$("#frame").attr("src", "http://www.example.com");
}, 3000);
});

نمونه بخش html صفحه:

<iframe width="400px" height="300px" id="frame">
</iframe>

amaa_tama

پنج شنبه 20 شهریور 1393, 16:20 عصر

با سلام خدمت شما دوست گرامی
ابتدا کتابخانه jquery را از آدرس زیر دریافت کنید.
http://code.jquery.com/jquery-1.6.4.min.js

بعد از اضافه کردن کتابخانه jquery به صفحه ای که iframe وجود دارد از کد زیر برای بارگذاری مجدد iframe به ازای هر 3 ثانیه استفاده کنید.
(http://www.example.com آدرس صفحه شماست)

$(function () {
setInterval(function () {
$("#frame").attr("src", "http://www.example.com");
}, 3000);
});

نمونه بخش html صفحه:

<iframe width="400px" height="300px" id="frame">
</iframe>

دوست عزیز خیلی ازت ممنون ولی خوب اینکه باعث میشه کاربر ببینه که داره کانکت میشه . چیزی که میخوام شبیه اینه : مثلا دیدین تو بعضی سایتها بدون اینکه مرورگر کاربر ارسال اطلاعات رو نشون بده از یه فرم تماس برای ارسال اطلاعات استفاده میشه . مثلا فرم های تماس یا حتی تعویض کدهای کپچا هم بدون رفرش صفحه میشه .

کدی که بتونه اطلاعات صفحه یا همان آدرس فریم رو بدون رفرش صفحه ی اصلی که فریم در اون قرار گرفته نمایش داده و رفرش کنه .

Mori Bone

پنج شنبه 20 شهریور 1393, 17:12 عصر

مثلا فرم های تماس یا حتی تعویض کدهای کپچا هم بدون رفرش صفحه میشه .
شما می حواین کله سایت رو رفرش کنید و تازه کنید. اون تکنولوژی که شما نام بردید اسمش ajax هست و اصلا برای این کار امکان پذیر نیس.

mohammad reza beizavi

پنج شنبه 20 شهریور 1393, 17:59 عصر

درود
این کار خیلی راحته، یعنی دقیقا همون چیزی که FastDesin گذاشتن.
اما اگر با iFrame مشکل دارید می تونید از این نمونه کدی که میذارم استفاده کنید.
فقط اگر به اینترنت متصل نیستید jquery-1.10.1.min.js رو بگیرید و SRC رو تغییر بدید.
البته فقط برای نمونه:

<HTML>
<HEAD>
<TITLE>Refresh Div without Reloading Page</TITLE>
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(
function() {
setInterval(function() {
var randomnumber = Math.floor(Math.random() * 100);
$('#show').text(
'I am getting refreshed every 3 seconds..! Random Number ==> '
+ randomnumber);
}, 3000);
});
</script>

</HEAD>
<BODY>
<br>
</BODY>
</HTML>

FastDesign.ir

پنج شنبه 20 شهریور 1393, 19:17 عصر

سلام دوباره خدمت شما دوست گرامی
کدی که در پست قبلی قرار داده شد هیچگونه رفرشی در صفحه ایجاد نخواهد کرد و تنها لودینگ مرورگر در بالای صفحه به چرخش درخواهد آمد.
به طور پیش فرض استفاده از آجاکس برای دسترسی به یک سایت دیگر امکان پذیر نیست(به دلیل تغییر نام دامنه). اما می توان با cross origin نمودن آجاکس این مفهوم را پیاده سازی نمود.
کد زیر تمامی چیزی است که شما به آن نیاز دارید .

نکته شماره 1: در صورتی که در صفحه ای که قصد لود کردن آن را دارید از استایل ها، تصاویر و جاوااسکریپت با آدرس دهی ریلیتیو استفاده شده باشد، هیچ یک لود نخواهد شد.
نکته شماره 2: در صورتی هم که از آدرس دهی مطلق در فراخوانی استایل ها استفاده شده باشد، کلاس ها و استایل ها، بر روی سایر المان های مشابه موجود در صفحه فراخوان(لود کننده) تاثیر خواهد گذاشت.
نکته شماره 3: فایل jquery cross orgin را از آدرس زیر دریافت نموده و بعد از jquery در صفحه، آن را فراخوانی کنید.

http://www.ajax-cross-origin.com/ajax-cross-origin.zip

$(function () {
setInterval(function () {
$.ajax({
crossOrigin: true,
url: "http://www.example.com",
success: function (data) {
$('#load').html(data);
}
});
}, 3000);

});

<div id="load">
</div>

amaa_tama

پنج شنبه 20 شهریور 1393, 22:03 عصر

سلام دوباره خدمت شما دوست گرامی
کدی که در پست قبلی قرار داده شد هیچگونه رفرشی در صفحه ایجاد نخواهد کرد و تنها لودینگ مرورگر در بالای صفحه به چرخش درخواهد آمد.
به طور پیش فرض استفاده از آجاکس برای دسترسی به یک سایت دیگر امکان پذیر نیست(به دلیل تغییر نام دامنه). اما می توان با cross origin نمودن آجاکس این مفهوم را پیاده سازی نمود.
کد زیر تمامی چیزی است که شما به آن نیاز دارید .

نکته شماره 1: در صورتی که در صفحه ای که قصد لود کردن آن را دارید از استایل ها، تصاویر و جاوااسکریپت با آدرس دهی ریلیتیو استفاده شده باشد، هیچ یک لود نخواهد شد.
نکته شماره 2: در صورتی هم که از آدرس دهی مطلق در فراخوانی استایل ها استفاده شده باشد، کلاس ها و استایل ها، بر روی سایر المان های مشابه موجود در صفحه فراخوان(لود کننده) تاثیر خواهد گذاشت.
نکته شماره 3: فایل jquery cross orgin را از آدرس زیر دریافت نموده و بعد از jquery در صفحه، آن را فراخوانی کنید.

$(function () {
setInterval(function () {
$.ajax({
crossOrigin: true,
url: "http://www.example.com",
success: function (data) {
$('#load').html(data);
}
});
}, 3000);

});

<div id="load">
</div>

دوست عزیز از کمکت خیلی ممنونم ولی من نونستم از کد بالا استفاده کنم . چون نوشته بودید cross orgin رو از آدرس زیر بگیرم ولی آدرسی نداده بودید . و یکمی پیچیده تر شد یکی میگه با آجاکس نمیتونم بعد یه دوست دیگه میاد کد میده الان من در هاست دایرکت ادمین با سیستم وردپرس در کل چطوری میتونم یک صفحه رو رفرش کنم بدون اینکه در مرورگر رفرشی اتفاق بیفته ؟؟ کد زیر اطلاعات موجود یا بهتره بگم آخرین اخبار مشاهده توسط کاربران رو با آی فریم نشون میده حالا من میخوام اون صفحه که حاوی نمایش آخرین اخبار کاربران هست یا آدرس فریم عوض بشه و هر سه ثانیه رفرش بشه تا خبر جدیدتر نمایش داده بشه .

<iframe width="180px" height="240px" frameborder="0" src="http://example.com/last-reading-news/" id="Header1_CurrentNewsReaderFrame" class="CurrentNewsReaderFrame" scrolling="no" allowtransparency="true">
</iframe>

FastDesign.ir

پنج شنبه 20 شهریور 1393, 22:20 عصر

آدرس فایل به پست قبلی اضافه شد.
دوست عزیز اگر پست قبلی اینجانب را دقیق مطالعه کنین می فهمین که چرا گفتن یکم این کار مشکل دارد.
در هر صورت از کد پست قبل استفاده کنین بعد اگر مشکلی بود مطرح کنین.

amaa_tama

جمعه 21 شهریور 1393, 00:55 صبح

آدرس فایل به پست قبلی اضافه شد.
دوست عزیز اگر پست قبلی اینجانب را دقیق مطالعه کنین می فهمین که چرا گفتن یکم این کار مشکل دارد.
در هر صورت از کد پست قبل استفاده کنین بعد اگر مشکلی بود مطرح کنین.

دوست عزیز بازم از کمکت تشکر میکنم کد زیر سورس صفحه ای است که من با آی فریم اونو در صفحه ای اصلی سایتم نشون میدم . کد شما رو هم در کد زیر جاسازی کردم ولی بازم درست کار نمیکنه . کلا رفرش نمیشه .

<?php
/**
* Template Name: last-reading-news
*/
?>
<!DOCTYPE html>
<html dir="rtl">
<head>
<title></title>

<style type="text/css">
body, html {
padding: 0;
margin: 0;
overflow: hidden;
}

body {
background: #f8b004; topmargin="0";
}

li {
margin-right:20px;
text-align: right;
direction: rtl;
margin-bottom:5px;
}

a {
color: black;
text-decoration: none;
font-family: Tahoma;
font-size: 8pt;
text-align:right;
}

ul {
list-style:url("/Content/b.gif");
margin:0;
padding:2px
}

</style>

<script type="text/javascript" src="http://example.com/wp-content/uploads/2014/09/jquery.ajax-cross-origin.min_.js"></script>

</head>
<body>

<script>
$(function () {
setInterval(function () {
$.ajax({
crossOrigin: true,
url: "http://example.com/last-reading-news/",
success: function (data) {
$('#load').html(data);
}
});
}, 3000);

});
</script>
<div id="load">

<ul>
<?php recently_viewed_posts( $max_shown = 20 ); ?>
</ul>
</div>

</body>
</html>

FastDesign.ir

جمعه 21 شهریور 1393, 09:37 صبح

دوست خوبم شما باید کتابخانه jquery را هم به صفحه اضافه کنین(قبل از فایل cross origin). لینک دانلود در پست اول وجود دارد.
این کدها را باید در صفحه اصلی سایت خود قرار دهید تا محتویات صفحه مورد نظر در آن به صورت اتوماتیک هر 3 ثانیه یک بار آپدیت شود.
همچنین با وجود این کد، نیازی به iframe نیست(صفحه شما در div قرار داده شده نمایش داده خواهد شد).
آدرس http://example.com را به آدرس صفحه خود تغییر دهید.

amaa_tama

جمعه 21 شهریور 1393, 17:36 عصر

دوست خوبم شما باید کتابخانه jquery را هم به صفحه اضافه کنین(قبل از فایل cross origin). لینک دانلود در پست اول وجود دارد.
این کدها را باید در صفحه اصلی سایت خود قرار دهید تا محتویات صفحه مورد نظر در آن به صورت اتوماتیک هر 3 ثانیه یک بار آپدیت شود.
همچنین با وجود این کد، نیازی به iframe نیست(صفحه شما در div قرار داده شده نمایش داده خواهد شد).
آدرس http://example.com را به آدرس صفحه خود تغییر دهید.

دوست عزیز من کتابخانه jquery رو هم هم اضافه کردم ولی باز div صفحه رو شون نمیده اون آدرس رو هم تغییر دادم به سایتهای مختلف ولی نمایش نمیده برای div طول و عرض هم تعیین کردم هر کاری که بشه کردم ولی نشون نمیده . انگاری div در صفحه نیست . دوست عزیز میشه لطفا شما یه نمونه آدرس که با اون div و کتابخانه ها و اون کدها نشون داده میشه و هر 3 ثانیه ری لود میشه رو برام بذارید تا ازش استفاده کنم ؟ شاید من نمیتونم درست و صحیح تنظیماتش رو بکنم .

FastDesign.ir

جمعه 21 شهریور 1393, 18:02 عصر

دوست گرامی برای مشاهده نمونه به آدرس زیر سر بزنید.

http://jsfiddle.net/wazc8za0/

هر 5 (5 + زمان بارگذاری صفحه) ثانیه یک بار، صفحه در پایین سمت راست به روز می شود.
در ابتدا نیز 5 ثانیه طول خواهد کشید تا صفحه ظاهر گردد.

amaa_tama

جمعه 21 شهریور 1393, 22:25 عصر

دوست گرامی برای مشاهده نمونه به آدرس زیر سر بزنید.

http://jsfiddle.net/wazc8za0/

هر 5 (5 + زمان بارگذاری صفحه) ثانیه یک بار، صفحه در پایین سمت راست به روز می شود.
در ابتدا نیز 5 ثانیه طول خواهد کشید تا صفحه ظاهر گردد.

دوست عزیز از راهنمایی های بسیار بسیار خوبت ممنون . مشکلم کلا حل شد . خیلی خیلی خیلی ممنون ازت . تشکر .

انشالله روزهایی پر از شادی و سلامتی داشته باشید .

FastDesign.ir

شنبه 22 شهریور 1393, 13:47 عصر

سلام دوباره خدمت شما دوست گرامی
برای اینکه در ابتدای بارگذاری صفحه اصلی، صفحه مورد نظر نیز مشاهده شود و 5 ثانیه اولیه انتظار حذف گردد؛ کد جاوااسکریپت کمی تغییر خواهد نمود.
برای مشاهده کد جدید، می توانید به آدرس زیر رجوع کنید:
http://jsfiddle.net/wazc8za0/1/

amaa_tama

شنبه 22 شهریور 1393, 19:18 عصر

سلام دوباره خدمت شما دوست گرامی
برای اینکه در ابتدای بارگذاری صفحه اصلی، صفحه مورد نظر نیز مشاهده شود و 5 ثانیه اولیه انتظار حذف گردد؛ کد جاوااسکریپت کمی تغییر خواهد نمود.
برای مشاهده کد جدید، می توانید به آدرس زیر رجوع کنید:
http://jsfiddle.net/wazc8za0/1/

از دوست عزیزم تشکر میکنم .

امیدوارم سایر دوستان هم بتونن از این پرسش و پاسخ های بسیار مفید استفاده بکنند و بتونند نیازهای خودشون رو برطرف کنن .

با آرزوی سلامتی برای همه دوستان گل .