PDA

View Full Version : سوال: لود اسکریپت به صورت داینامیک


ingenuous67
سه شنبه 08 بهمن 1392, 16:17 عصر
سلام دوستان
خلاصه بگم:
توی یک صفحه یک دکمه دارم. می خوام وقتی روش کلیک می کنم یک اسکریپت در بخش head سایت لود بشه. توجه کنید در حالت معمولی یعنی بدون کلیک روی دکمه این اسکریپت لود نمیشه و بعد از کلیک روی دکمه این اسکریپت به بخش head اضافه میشه. کد رو ببینید:

<html>
<head>

<script type="text/javascript">
function loadjscssfile(filename){

var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src", filename)

if (typeof fileref!="undefined")
document.getElementsByTagName("head")[0].appendChild(fileref)
h();
}
</script>
</head>
<body>

<button id="load map" onClick="loadjscssfile('js/tt.js');">load map</button>
</body>
</html>
الان وقتی روی دکمه کلیک می کنم تابع h اجرا نمیشه و بار دوم که کلیک می کنم این تابع اجرا میشه.
فایل tt.js هم به این صورته:
function h()
{

alert('iuy56788767');
}


یا علی
jalil_gh
جمعه 11 بهمن 1392, 00:40 صبح
کد شما مشکلی نداره و اسکریپت رو به درستی لود می‌کنه.
چیزی که شما باید بدونید اینه که این اسکریپت به صورت اسینکرون لود میشه و وقتی که تابع h صدا زده میشه هنوز اسکریپت لود نشده. شما باید تابع h رو بعد از اینکه اسکریپت لود شد و اجرا شد صدا بزنید.
ingenuous67
شنبه 12 بهمن 1392, 10:39 صبح
خوب من هم بعد از لود اسکریپت تابع h رو صدا زدم.
به نظر شما تابع h من قبل از اسکریپت اجرا میشه؟
اگه اینطوره پس تابع رو کجا باید فراخونی کنم؟
البته یه نکته بگم اینکه:
اگه قبل از تابع h یک دستور alert بذارم مشکل حل میشه و یا اینکه فراخونی تابع h رو روی یک دکمه دیگه بذارم بازم مشکل حل میشه.
ولی من میخوام تابع h توی همون دکمه ای که اسکریپت رو لود میکنه اجرا بشه و قبلش هم alert نباشه.
jalil_gh
شنبه 12 بهمن 1392, 11:59 صبح
تو اون روشی که شما به کار بردید اتفاقی که می‌افته به این صورته.
وقتی شما دکمه رو کلیک می‌کنید یه درخواست به سمت سرور میره برای لود اسکریپت. ولی مرورگر منتظر لود شدن اسکریپت نمیمونه بلکه بقیه کد رو اجرا می‌کنه. شما درسته تابع h رو بعد از درخواست لود اسکریپت نوشتین ولی وقتی اجرای کد به اون خط می‌رسه هنوز اسکریپت در حال لود شدنه برای همین تابع h هنوز وجود خارجی نداره.
این روش هم یه چیزی مثل ایجکس میمونه. تو ایجکس شما می‌تونید درخواست رو هر وقت که خواستید بفرستید ولی اینکه جوابش کی میاد دیگه با .... برای همین تو اینجور مواقع از callback استفاده می‌شه. این callback یه تابع هست که بعد از اومدن اطلاعات و یا اسکریپت و یا ... اجرا میشه.
میشه برای تابع شما هم یه همچین امکانی تعریف کرد که در اون صورت تابع شما به این صورت در میاد:
function loadJS(filename, callback) {

var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src", filename)

if (typeof fileref!="undefined") {
document.getElementsByTagName("head")[0].appendChild(fileref);
if (typeof callback === "function") {
fileref.onload = callback;
}
}
}

بعد خاصیت onclick هم به این صورت در میاد.

<button onClick="loadJS('tt.js', function(){h()});">load map</button>