الدالة jQuery.getScript() في jQuery
jQuery.getScript( url [, success ] )
القيم المعادة
تعيد كائنًا من النوع jqXHR.
الوصف
تجلب هذه الدالة ملف JavaScript من الخادم باستعمال طلب HTTP عبر الطريقة GET ثمَّ يُنفِّذه.
jQuery.getScript( url [, success ] )
أُضيفت مع الإصدار: 1.0.
url
سلسلة نصية تحتوي على الرابط URL الذي سيُرسَل الطلب إليه.
success
دالةٌ من الشكل Function( String script, String textStatus, jqXHR jqXHR ) يراد تنفيذها إن نجح الطلب.
هذه الدالة هي اختزالٌ للدالة jQuery.ajax()، إذ تكافئ:
$.ajax({
url: url,
dataType: "script",
success: success
});
يُنفَّذ السكربت في السياق العام (global context)، لذا يمكن الإشارة إلى متغيِّرات أخرى واستعمال دوال jQuery. يمكن أن يكون للسكربتات المضمَّنة تأثيرًا على الصفحة الحاليَّة.
رد النداء success
يُطلَق رد النداء متى ما جُلِبَ السكربت وليس بالضرورة أن يكون قد نٌفِّذَ آنذاك.
تُضمَّن السكربتات وتنفَّذ بالإشارة إلى اسم الملف:
$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
console.log( data ); // Data returned
console.log( textStatus ); // Success
console.log( jqxhr.status ); // 200
console.log( "Load was performed." );
});
معالجة الأخطاء
بدءًا من الإصدار jQuery 1.5، تستطيع استعمال التابع .fail() لوضع احتمالية حدوث أي خطأ في الحسبان:
$.getScript( "ajax/test.js" )
.done(function( script, textStatus ) {
console.log( textStatus );
})
.fail(function( jqxhr, settings, exception ) {
$( "div.log" ).text( "استُدعِي معالج الأخطاء." );
});
كان يُستخدَم قبل الإصدار jQuery 1.5 حدث رد النداء .ajaxError() العام من أجل معالجة أخطاء التابع $.getScript():
$( "div.log" ).ajaxError(function( e, jqxhr, settings, exception ) {
if ( settings.dataType == "script" ) {
$( this ).text( "ajaxError استُدعِي معالج الأخطاء." );
}
});
تخزين الردود
يعيِّن التابع $.getScript() قيمة الضبط cache إلى false افتراضيًّا. هذا يضيف معامل استعلام بصمة وقت (timestamped query) إلى العنوان URL للتأكد من أنَّ المتصفح قد نَزَّل السكربت في كلِّ مرةٍ أُرسِل طلبٌ بذلك. يمكنك تجاهل هذه الميِّزة عبر تغيير قيمة الضبط cache إلى القيمة true على الصعيد العام باستعمال $.ajaxSetup():
$.ajaxSetup({
cache: true
});
يمكنك تعريف تابع جديد أكثر مرونة يرتكز على $.ajax() بدلًا استعمال التابع $.getScript() عند الاضطرار إليه مع عدم الرغبة بذلك.
أمثلة
تعريف التابع $.cachedScript() الذي يسمح لنا بجلب السكربت المخزَّن:
jQuery.cachedScript = function( url, options ) {
// url و cache و dataType السماح للمستخدم بتعيين قيمة أي ضبط باستثناء
options = $.extend( options || {}, {
dataType: "script",
cache: true,
url: url
});
// $.getScript() فهي أكثر مرونة من $.ajax استعمال
// وبذلك يمكننا ربطه بردود نداء jqXHR إعادة الكائن
return jQuery.ajax( options );
};
// كيفية استعمال التابع الجديد
$.cachedScript( "ajax/test.js" ).done(function( script, textStatus ) {
console.log( textStatus );
});
جلب إضافة تحريك الألوان الرسمية من jQuery ديناميكيًّا وربط بعض حركات الألوان لتنفيذها متى ما حصلنا على الوظيفة الجديدة:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.getScript مثالٌ عن استعمال التابع</title>
<style>
.block {
background-color: blue;
width: 150px;
height: 70px;
margin: 10px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<button id="go">» ابدأ</button>
<div class="block"></div>
<script>
var url = "https://code.jquery.com/color/jquery.color.js";
$.getScript( url, function() {
$( "#go" ).click(function() {
$( ".block" )
.animate({
backgroundColor: "rgb(255, 180, 180)"
}, 1000 )
.delay( 500 )
.animate({
backgroundColor: "olive"
}, 1000 )
.delay( 500 )
.animate({
backgroundColor: "#00f"
}, 1000 );
});
});
</script>
</body>
</html>