جلوگیری از لود شدن یک کد تا قبل از کلیک روی آن

[mahdi-24]

سلام دوستان و اس
من از وردپرس استفاده میکنم
یه jquery گرفتم از این آدرس
http://www.jqueryscript.net/accordion/Responsive-jQuery-Accordion-Plugin-with-Smooth-Sliding-Effect.html

اگه به دمو بروید می بینید که وقتی روی تب ها کلیک میکنیم نوشته ها باز میشه، من اومدم بجای این نوشته ها این کد رو گذاشتم:
<div class="play1">
<p style="text-align: right;"> پخش آنلاین :</p>
<p style="text-align: center;">
<?php $var1 = get_post_meta($post->ID, 'vcod1', true);
if ($var1 == '')
{ }
else { echo do_shortcode( '' . $var1 . ''); } ?>
</div>

درواقع در این کد vcod1 یه زمینه دلخواه هست که وقتی میخوام نوشته ای رو ایجاد کنم در قسمت زمینه دلخواه vcod1 رو شرت کد jwplayer قرار میدم. با این کار وقتی کاربر روی تب کلیک میکند یه ویدئویی آماده پخش آنلاینه. تا اینجا مشکلی نیست
الان میخوام برای افزایش سرعت بارگزاری، تا بازدید کننده روی تب ها کلیک نکرده پلیر ها ( یا همون زمینه دلخواه vcod1) لود نشه. اگر هم روی یکی از تب ها کلیک کرد فقط همون پلیر لود بشه.
ممنون میشم اساتید جوری توضیح بدهند که منِ مبتدی هم متوجه بشم. سپاس

[Freedon_23]

سلام
ببینید وقتی با جی کوئری چند تا تب درست میکنن در واقع همه محتوای تب ها لود و بارگذاری میشه منتها تا موقعی که رو تب مورد نظر کلیک نکردید محتوای اون تب نمایش داده نمیشه یعنی display اون تب none هست وقتی شما روی اون تب کلیک میکنید با جی کوئری display اون عوض میشه و شما اون تب رو میبینید.
چیزی که شما نیاز دارید با ajax درست میشه یعنی اون تب از اول بارگذاری نشه تا موقعی که رو اون کلیک کنن، بعد از کلیک هم با ajax یه درخواست به سرور ارسال میشه و محتوای اون تب خوانده شده و به کاربر نمایش داده میشه.
البته امیدوارم منظور شما رو درست متوجه شده باشم اگر سوالی داشتید بفرمائید.

[mahdi-24]

سلام
ببینید وقتی با جی کوئری چند تا تب درست میکنن در واقع همه محتوای تب ها لود و بارگذاری میشه منتها تا موقعی که رو تب مورد نظر کلیک نکردید محتوای اون تب نمایش داده نمیشه یعنی display اون تب none هست وقتی شما روی اون تب کلیک میکنید با جی کوئری display اون عوض میشه و شما اون تب رو میبینید.
چیزی که شما نیاز دارید با ajax درست میشه یعنی اون تب از اول بارگذاری نشه تا موقعی که رو اون کلیک کنن، بعد از کلیک هم با ajax یه درخواست به سرور ارسال میشه و محتوای اون تب خوانده شده و به کاربر نمایش داده میشه.
البته امیدوارم منظور شما رو درست متوجه شده باشم اگر سوالی داشتید بفرمائید.
سلام ممنون از پاسختون، بله درست میفرمایید منتها من در این زمینه کاملا آماتور هستم
ممنون میشم منو راهنمایی کنید که کجا دنبال این کد بگردم و چی رو سرچ کنم یا اگه امکان داره این کدی که میگین رو در اختیارم بذارید.

[Freedon_23]

<div class="acc-head">
نمایش ویدئو
</div>
<div class="acc-panel">

</div>


شما یک تگ دارید که با کلیک تب شما فعال میشه مثلا کلاس acc-head داره
و یک تگ دارید که محتوای تب در اون نمایش داده میشه مثلا کلاس acc-panel
وقتی رو عنوان تب کلیک میشه در خواست ajax بوسیله جی کوئری به سرور ارسال میشه و سپس اطلاعات دریافت شده از سرور مجدد با جی کوئری در داخل تگی که کلاس acc-panel داره نمایش داده میشه.

jQuery(document).ready(function() {
jQuery('div.acc-head').on("click", function() {
var data = ''; // if any variable exist can be here
var player_url = 'player.php';
jQuery.ajax({
type: "POST",
url: player_url,
data: data,
success: function(resp){
jQuery('div.acc-panel').html(resp);
}
});
});
});


به جای فایل player.php آدرس فایلی رو وارد کنید که پلیر شما و ویدئو شما در اون قرار داره، تو متغیر data هم میتونید متغیر هایی که دارید به فایل مورد نظر ارسال کنید که باید به این صورت باشه


id="25"

مثل زمانی که در آدرس بار متغیر میفرستید.
امیدوارم مفید باشه، سوالی بود بفرمائید.

[mahdi-24]

<div class="acc-head">
نمایش ویدئو
</div>
<div class="acc-panel">

</div>


شما یک تگ دارید که با کلیک تب شما فعال میشه مثلا کلاس acc-head داره
و یک تگ دارید که محتوای تب در اون نمایش داده میشه مثلا کلاس acc-panel
وقتی رو عنوان تب کلیک میشه در خواست ajax بوسیله جی کوئری به سرور ارسال میشه و سپس اطلاعات دریافت شده از سرور مجدد با جی کوئری در داخل تگی که کلاس acc-panel داره نمایش داده میشه.

jQuery(document).ready(function() {
jQuery('div.acc-head').on("click", function() {
var data = ''; // if any variable exist can be here
var player_url = 'player.php';
jQuery.ajax({
type: "POST",
url: player_url,
data: data,
success: function(resp){
jQuery('div.acc-panel').html(resp);
}
});
});
});


به جای فایل player.php آدرس فایلی رو وارد کنید که پلیر شما و ویدئو شما در اون قرار داره، تو متغیر data هم میتونید متغیر هایی که دارید به فایل مورد نظر ارسال کنید که باید به این صورت باشه


id="25"

مثل زمانی که در آدرس بار متغیر میفرستید.
امیدوارم مفید باشه، سوالی بود بفرمائید.

ممنون داداش
اگه درست متوجه شده باشم باید هر ویدئویی رو که میخوام بذارم اول اون ویدئو رو داخل یه صفحه Html یا php قرار بدم بعد آدرس اون رو توی این کد بیارم.درسته؟
اگه اینجوری باشه مثلا برای اینکه طی مدتی 1000تا ویدئو در سایت قرار بدیم باید 1000 صفحه دستی ایجاد کنم و اون ویدئو ها رو داخلشون بذارم.
راهی نیست که دیگه صفحه php برای هر ویدئو ایجاد نکنیم؟

[Freedon_23]

سلام
خواهس می کنم، نه شما یک فایل php درست می کنید که همه ویدئو ها رو بخونه حالا یا از دیتابیس یا از پوشه ها. شما هر دفعه که رو تب کلیک میشه اطلاعات (آدرس ویدئو یا ای دی اون تو دیتابیس) فایل ویدئو رو به فایل php میفرستید تا خونده بشه من متغیر data رو برا همین گذاشتم فرض کنید اگر ویدئو ها تو دیتابیس ذخیره هستند id اون ویدئو تو متغیر data ذخیره میشه و به فایل php ارسال میشه مثلا id=25 و فایل php میره ویدئویی که id اون 25 باشه می خونه و پخش میکنه.
اون id رو هم میتونید تو یک تگ ذخیره کنید مثلا تو title تگی که روش کلیک میشه بذارید:


<div class="acc-head" title="25">
نمايش ويدئو
</div>

و با جی کوئری اون رو بگیرید و تو متغیر data بریزید:

var id = jQuery(this).attr('title');
var data = 'id='+id;

شما این دو خط رو بجای خط 3 تو کدهای جی کوئری بذارید.
بعد تو فایل php شما از متغیر POST استفاده می کنید:


$video = $_POST['id'];

بعد الان میتونید هر دفعه متغیر video متفاوت داشته باشید و فایل مورد نظر رو پخش کنید.