رویداد ( ) dblclick در jQuery :

رویداد dblclick زمانی اتفاق می افتد که کاربر بر روی عنصر مورد نظر دابل کلیک نماید . با این رویداد برای مثال می توان کدی طراحی کرد که در هنگام دابل کلیک کاربر بر روی یک عنصر رنگ پس زمینه آن عوض شده و یا عنصر مخفی شود .
شکل کلی استفاده از این متد به شرح زیر است :

Syntax $ ( " selector " ).dblclick ( function ( ) { ... some code ... } ;

توضیح هر یک از موارد syntax :

syntax توضیح
توضیح Parameter
selector کنترلی است که کاربر بر روی آن دابل کلیک می کند . selector
این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود . function ( )

Example $ ( " :p " ).dblclick ( function ( ) { ... some code } ;

در چند مثال سعی می کنیم تا استفاده از رویداد dblclick را در عمل به شما نمایش دهیم .
مثال : در مثال اول یک پاراگراف داریم . کدی طراحی کرده ایم که در صورتی که کاربر بروی پاراگراف مورد نظر دابل کلیک نماید ، فونت نوشته به صورت توپر ( bold ) در می آید . برای مشاهده خروجی بر روی پاراگراف دابل کلیک نمایید:

Example
< html >
  < head >
    < script type="text/javascript" src="jquery.js" > < /script >
    < script type="text/javascript" >

      $ (document). ready ( function( ) {
        $ (" # P_1 ") . dblclick ( function( ){
          $ ( " # P_1 " ) . css( " font-weight " , " bold " );
          });
        });
    </script>

  </head>
<body>
    <p id= "P_1" style = "font-size: medium" > jQuery offers developers a lot of tools to work with html elements . < /p >
</body>
</html>
کد

مثال : در مثال دوم یک تگ div طراحی کرده ایم که در صورت دابل کلیک کاربر بر روی آن ، با استفاده از متد ( ) slideUp به آرامی مخفی می شود . برای مشاهده خروجی روی عبارت خروجی مثال دابل کلیک نمایید :

Example
< html >
  < head >
    < script type="text/javascript" src="jquery.js" > < /script >
    < script type="text/javascript" >

      $ (document). ready ( function( ) {
        $ (" # div_1 ") . dblclick ( function( ){
          $ ( " # div_1 " ) . slideUp ( );
          });
        });
    </script>

  </head>
<body>
    < div id="div1" style="font-size: medium" border-width: thin; background-color: Lime >
     In jQuery you can do a lot of things with hmtl elements . <br /> even hide and show them .
    < /div >

</body>
</html>
کد

 

تعداد امتیازدهندگان: 6497
مسیر کوتاه: rangine.ir/node/99