Jquery

Page 35

‫آﻣﻮزش ‪jQuery‬‬

‫‪blog.monavarian.ir‬‬

‫;)(‪$('p').debug‬‬ ‫در داﺧﻞ ﺗﺎﺑﻊ ‪ debug‬ﻣﺘﻐﯿﺮ ‪ this‬ﻪﺑ "‪ "p‬اﺷﺎره ﻣﯽ ﮐﻨﺪ‪.‬‬ ‫ﺗﻤﺎم ﻣﺘﺪ ھﺎ و ﺗﻮاﺑﻊ ﺑﺎﯾﺪ ﺑﺎ ﻋﻼﻣﺖ ﺳﯿﻤﯽ ﻦﻟﺎﮐ "; " ﺗﻤﺎم ﺷﻮﻧﺪ ‪ .‬در ﻏﯿﺮ اﯾﻨﺼﻮرت ھﻨﮕﺎم ﻓﺸﺮده‬ ‫•‬ ‫ﺳﺎزی ﮐﺪ ھﺎ ﺑﺎ ﻣﺸﮑﻞ ﻣﻮاﺟﻪ ﻣﯿﺸﻮﻧﺪ ‪.‬‬ ‫ﻣﻘﺪار ﺑﺎزﮔﺸﺘﯽ ﻣﺘﺪھﺎی ﻧﻮﺷﺘﻪ ﺷﺪه ﺑﺎﯾﺪ از ﺟﻨﺲ ﺷﯽ ‪ jquery‬ﺑﺎﺷﻨﺪ ﻣﮕﺮ ﺑﻄﻮر ﺻﺮﯾﺢ ﻣﺸﺨﺺ‬ ‫•‬ ‫ﺷﺪه ﺑﺎﺷﻨﺪ ‪.‬‬ ‫در ﺻﻮرﺗﯽ ﮐﻪ ﻣﯿﺨﻮاھﯿﺪ ﻣﺘﺪ ﺷﻤﺎ ﺑﺮای ﺗﻤﺎم ﻋﻨﺎﺻﺮ اﻧﺘﺨﺎﺑﯽ اﺟﺮا ﮔﺮدد از روﯾﺪاد ‪ this.each‬ﺑﺮای‬ ‫•‬ ‫ﻧﻮﺷﺘﻦ روﯾﺪاد ﺑﺮای ﻋﻨﺎﺻﺮ اﻧﺘﺨﺎﺑﯽ اﺳﺘﻔﺎده ﮐﻨﯿﺪ‬ ‫ھﻤﯿﺸﻪ ﺑﺮای ﺳﺮﺑﺎرﮔﺰاری ﺗﺎﺑﻊ از ‪ jquery.fn‬ﺑﻪ ﺟﺎی ‪ $.fn‬اﺳﺘﻔﺎده ﻧﻤﺎﯾﯿﺪ ‪ .‬زﯾﺮا ﻣﻤﮑﻦ اﺳﺖ ﺑﺮﺧﯽ‬ ‫•‬ ‫از ﮐﺎرﺑﺮان ﺗﻮﺳﻂ ﺗﺎﺑﻊ )(‪ noConflict‬از ﻧﺎم ﻣﺴﺘﻌﺎر دﯾﮕﺮی ﺑﺠﺎی ‪ $‬اﺳﺘﻔﺎده ﻧﻤﻮده ﺑﺎﺷﻨﺪ و در اﯾﻦ‬ ‫ﺻﻮرت ﻧﻤﯿﺘﻮاﻧﻨﺪ از ﮐﺪ ﺷﻤﺎ اﺳﺘﻔﺎده ﮐﻨﻨﺪ ‪ .‬اﻟﺒﺘﻪ ﻣﯿﺘﻮاﻧﯿﺪ در داﺧﻞ ﺗﻮاﺑﻊ ﺗﺎن از ‪ $‬اﺳﺘﻔﺎده ﻧﻤﺎﯾﯿﺪ‪) .‬در‬ ‫ﻣﻮرد ﺗﺎﺑﻊ ‪ noConflict‬در ﻓﺼﻞ اول ﺗﻮﺿﯿﺢ داده ﺷﺪه اﺳﺖ ( ‪.‬‬ ‫راه دﯾﮕﺮ ﺑﺠﺎی اﺳﺘﻔﺎده از ﺗﺎﺑﻊ ‪ jQuery‬ﺑﻪ ﺟﺎی ‪ . $‬ﻗﺮار دادن ھﻤﻪ ﮐﺪھﺎی ﭘﻼﮔﯿﻦ در ﯾﮏ ﺑﻼک ﺑﻪ‬ ‫•‬ ‫ﻓﺮﻣﺖ زﯾﺮ اﺳﺖ‬ ‫;)‪(function($) { …. })(jQuery‬‬ ‫اﯾﻦ ﮐﺎر ﭼﻨﺪ ﻓﺎﯾﺪه دارد ‪ .‬اول اﯾﻨﮑﻪ ﮐﺪھﺎ ﻣﺤﺎﻓﻈﺖ ﻣﯿﺸﻮﻧﺪ و در ﺻﻮرﺗﯽ ﮐﻪ ﺗﺎﺑﻌﯽ ھﻢ ﻧﺎم ﺑﺎ ﺗﻮاﺑﻊ‬ ‫اﺳﺘﻔﺎده ﺷﺪه در ﭘﻼﮔﯿﻦ داﺷﺘﻪ ﺑﺎﺷﯿﺪ ﺑﻪ ﻣﺸﮑﻞ ﺑﺮ ﻧﻤﯿﺨﻮرﯾﺪ و ھﻤﭽﻨﯿﻦ ﻓﺎﯾﺪه دﯾﮕﺮ اﯾﻦ ﮐﺎر اﯾﻦ اﺳﺖ ﮐﻪ‬ ‫ﻣﯿﺘﻮاﻧﯿﺪ ﺗﻮاﺑﻊ و ﻣﺘﻐﯿﺮ ھﺎ را از دﺳﺘﺮس ﺳﺎﯾﺮ ﺑﺮﻧﺎﻣﻪ ھﺎ ﭘﻨﮫﺎن ﮐﻨﯿﺪ و در ﻧﺘﯿﺠﻪ از ﺗﻐﯿﯿﺮات اﺣﺘﻤﺎﻟﯽ آﻧﮫﺎ‬ ‫ﺟﻠﻮﮔﯿﺮی ﻧﻤﺎﯾﯿﺪ ‪ .‬ﭘﺲ ﺗﻮﺻﯿﻪ ﻣﯿﺸﻮد ﮐﺪھﺎی ﭘﻼﮔﯿﻦ ﺧﻮد را در اﯾﻦ ﺑﻼک ﺗﻌﺮﯾﻒ ﮐﻨﯿﺪ ‪.‬‬ ‫ﻼﺜﻣ ‪:‬‬ ‫{ )‪(function($‬‬ ‫;‪var x,y,z‬‬ ‫;)‪})(jQuery‬‬ ‫در اﯾﻦ ﻣﺜﺎل ﻣﺘﻐﯿﺮ ھﺎی ‪ x ,y ,z‬ﻣﺘﻐﯿﺮھﺎی ﺳﺮاﺳﺮی ﻧﯿﺴﺘﻨﺪ و ﻓﻘﻂ داﺧﻞ ھﻤﯿﻦ ﺑﻼک ﻗﺎﺑﻞ اﺳﺘﻔﺎده اﻧﺪ ‪.‬‬ ‫ھﻤﯿﻦ ﻣﻄﺎﻟﺐ ﻓﻮق ﺑﺮای ﻧﻮﺷﺘﻦ ﯾﮏ ﭘﻼﮔﯿﻦ ﺳﺎده ﮐﻔﺎﯾﺖ ﻣﯿﮑﻨﺪ ‪ .‬ﺷﻤﺎ ﻣﯿﺘﻮاﻧﯿﺪ ﺑﺎ اﺳﺘﻔﺎده از ھﻤﯿﻦ‬ ‫ﻗﻮاﻧﯿﻦ اﻗﺪام ﺑﻪ ﻧﻮﺷﺘﻦ ﭘﻼﮔﯿﻦ و اﺳﺘﻔﺎده از آن در وﺑﺴﺎﯾﺖ ﺧﻮد ﻧﻤﺎﯾﯿﺪ ‪.‬‬ ‫ﺣﺎل ﺑﮫﺘﺮ اﺳﺖ ﭘﻠﻪ ﭘﻠﻪ آﻣﻮزش اﯾﺠﺎد ﭘﻼﮔﯿﻦ را ﭘﯿﺶ ﺑﺒﺮﯾﻢ ‪:‬‬ ‫ﺗﻔﺎوت ﻣﺘﺪ )‪ ( Method‬و ﺗﺎﺑﻊ ) ‪ ( function‬در ‪: jQuery‬‬ ‫ﺑﻪ ﻣﺜﺎل ﺑﺎﻻ دﻗﺖ ﻧﻤﺎﯾﯿﺪ ‪ .‬در ﻣﺜﺎل ﺑﺎﻻ ﯾﮏ ﻣﺘﺪ و ﯾﮏ ﺗﺎﺑﻊ اﯾﺠﺎد ﺷﺪه اﺳﺖ ‪ .‬ﻧﺤﻮه اﯾﺠﺎد ﺗﻮاﺑﻊ در ‪ jQuey‬ﻪﺑ‬ ‫ﻓﺮﻣﺖ زﯾﺮ ﻣﯽ ﺑﺎﺷﺪ ‪:‬‬ ‫; } … { )…‪jQuery.funcName = function(a,b,‬‬ ‫و ﺗﻌﺮﯾﻒ ﻣﺘﺪ ﺑﻪ ﺻﻮرت زﯾﺮ ﻣﯽ ﺑﺎﺷﺪ ‪:‬‬ ‫; } ;‪jQuery.fn.MethodName= function(options,…){ … return this‬‬ ‫ﺑﺮای ﺻﺪا زدن ﺗﻮاﺑﻪ از ﻋﺒﺎرت )…‪ $.funcName(a,b,‬اﺳﺘﻔﺎده ﻣﯿﻨﻤﺎﯾﯿﻢ در ﺻﻮرﺗﯽ ﮐﻪ ﺑﺮای ﺻﺪا زدن ﻣﺘﺪ‬ ‫ھﺎ از ﻋﺒﺎرت )‪. $(selector).methodName(options‬‬ ‫ھﻤﺎن طﻮر ﮐﻪ ﻗﺒﻼ ﺑﯿﺎن ﺷﺪ ﻣﺘﺪ ھﺎ ﺣﺘﻤﺎ ﺑﺎﯾﺪ ﻣﻘﺪار ﺑﺮﮔﺸﺘﯽ از ﺟﻨﺲ ﺷﯽ ‪ jQuery‬داﺷﺘﻪ ﺑﺎﺷﻨﺪ ‪ .‬اﯾﻦ‬ ‫ﺑﺪﻟﯿﻞ ﺧﺼﻮﺻﯿﺖ ﻓﺮاﺧﻮاﻧﯽ زﻧﺠﯿﺮه ای ﻣﺘﺪ ھﺎﺳﺖ )ھﺮ ﻣﺘﺪ ﺷﯽ ﻧﺘﯿﺠﻪ را ﺑﺮ ﻣﯿﮕﺮداﻧﺪ و ﻣﺘﺪ ﺑﻌﺪی روی‬ ‫ﻧﺘﯿﺠﻪ ﻋﻤﻠﯿﺎت ﺟﺪﯾﺪی اﻧﺠﺎم ﻣﯿﺪھﺪ و ﻣﺠﺪدا ﺷﯽ را ﺑﺮ ﻣﯿﮕﺮداﻧﺪ و اﯾﻦ ﻋﻤﻞ ﺑﺼﻮرت زﻧﺠﯿﺮه وار ﺗﺎ ﭘﺎﯾﺎن‬ ‫زﻧﺠﯿﺮه اداﻣﻪ ﭘﯿﺪا ﻣﯿﮑﻨﺪ ( در ﺻﻮرﺗﯽ ﮐﻪ در ﺗﻮاﺑﻊ اﻣﮑﺎن ﻓﺮاﺧﻮاﻧﯽ زﻧﺠﯿﺮه ای وﺟﻮد ﻧﺪارد و ﻣﯿﺘﻮاﻧﺪ ﻣﻘﺪار‬ ‫ﺑﺮﮔﺸﺘﯽ ﻧﺪاﺷﺘﻪ ﺑﺎﺷﺪ ‪.‬‬

‫ﻪﺤﻔﺻ ‪35‬‬


Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.