Header Ads

أحداث jQuery



تعتبر لغة jQuery سلسلة من الأحداث .




وظائف الأحداث


تعتبر طرائق أحداث jQuery صلب الأكواد الوظيفية functions في jQuery .

الطرائق البديلة هي أحداث يتم استدعائها عند حدوث شيء ما .

من الشائع والمهم وضع أكواد jQuery ضمن الطرائق في قسم <head> .

مثال
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
}); });

</script>
</head>
<body>

<h2>هذا عنوان</h2>
<p>هذا موضوع</p>
<p> هذا موضوع آخر</p>
<button>اضغط هنا</button>

</body>
</html>




في المثال السابق تم استدعاء function عند الضغط على الحدث الذي تم دمجه مع الزر :
$("button").click(function() {..الكود هنا ... } )

تخفي الطريقة جميع الفقرات <p> في الصفحة :
$("p").hide();






وضع functions في ملف منفصل


ان كان موقعك يحتوي على الكثير من الصفحات وتريد أن تكون أكواد و وظائف jQuery سهلة القراءة والتعديل عندها يمكنك وضعها في ملف منفصل امتداده .js

عندما قمنا بشرح أمثلة jQuery كان الكود موضوع ضمن قسم <head> و لكن من الأفضل وضع الأكواد في ملف منفصل ووضعه في قسم <head> ثم طلب الملف من خلال اللاحقة src :
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="my_jquery_functions.js"></script>
</head>





الخلافات حول الاسم


تستخدم jQuery إشارة $ كإختصار لاستخدام jQuery .

لكن بعض مكتبات الجافاسكربت تستخدم أيضاً إشارة $ لضبط functions لديهم .

تحدد طريقة noConflict() الاسم الافتراضي ( مثل jq ) عوضاً عن استخدام اشارة $ .




أحداث jQuery





























بعض الأمثلة في استخدام الأحداث في jQuery
طريقة الحدثالشرح
$(document).ready(function)يستخدم هذا الحدث عند انتهاء الصفحة من التحميل اي تصبح جاهزة ready .
$(selector).click(function)يستخدم عند الضغط على زر يقوم باستدعاء الحدث على العنصر المختار .
$(selector).dblclick(function)يستخدم عند الضغط بشكل مزدوج على زر يقوم باستدعاء الحدث على العنصر المختار .
$(selector).focus(function)يستخدم عند التركيز على حدث العنصر المختار .
$(selector).mouseover(function)يستخدم عند تمرير الماوس على العنصر المختار .


ليست هناك تعليقات:

يتم التشغيل بواسطة Blogger.