jQuery | dblclick () с примерами

Опубликовано: 14 Декабря, 2021

Dblclick () - это встроенный в jQuery метод, который используется для запуска события двойного щелчка . Этот метод возникает при двойном щелчке по выбранному элементу.
Синтаксис:

$ (селектор) .dblclick (аргументы);

Здесь «селектор» - это выбранный элемент.
Параметр: принимает необязательный параметр «args», который указывает функцию, которая выполняет определенную задачу после двойного щелчка.
Возвращаемое значение: возвращает некоторую функцию при двойном щелчке по выбранному элементу.

Код jQuery для демонстрации работы метода dblclick ():
Код №1:
В приведенном ниже коде этому методу не передается никакая функция.

 < html >
 
< head >
    < script src=" https://ajax.googleapis.com/ajax/libs/
                  jquery/3.3.1/jquery.min.js"></ script >
    < script >
        <!-- jQuery code to show dbclick method -->
        $(document).ready(function() {
                    $("div").click(function() {
                        $("div").dblclick();
                    });
    </ script >
    < style >
        div {
            display: block;
            width: 370px;
            padding: 10px;
            font-size: 25px;
            border: 2px solid green;
        }
    </ style >
 </ head >
 
< body >
    <!-- click on this div and a pop will appear -->
    < div ondblclick="alert('dblclick event has been triggered')
                 ">Click me to trigger dblclick event</ div >
 </ body >
 
</ html > 

Выход:
Перед двойным щелчком по кнопке «Щелкните меня, чтобы вызвать событие dblclick» -

После двойного щелчка по кнопке «Щелкните меня, чтобы вызвать событие dblclick» -

Код №2:
В приведенном ниже коде функция передается методу dblclick ().

 < html >
 
< head >
    < script src=" https://ajax.googleapis.com/ajax/libs/
    jquery/3.3.1/jquery.min.js"></ script >
    < script >
        <!-- jQuery code to show dbclick method -->
        $(document).ready(function() {
            $("button").dblclick(function() {
                $("p").fadeOut();
            });
        });
    </ script >
    < style >
        p {
            display: block;
            padding: 20px;
            color: gree;
            width: 300px;
            border: 2px solid green;
            font-size: 25px;
        }
    </ style >
 </ head >
 
< body >
    < p >Welcome to GeeksforGeeks !</ p >
    <!-- click on this button and above paragraph
            will disappear -->
    < button > Click Me! </ button >
 </ body >
 
</ html > 

Выход:
Перед двойным щелчком по кнопке «Click Me» -

После двойного щелчка по кнопке «Click Me» -

JavaScript JQuery

jQuery | dblclick () с примерами

РЕКОМЕНДУЕМЫЕ СТАТЬИ