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

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

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

$ (селектор) .focus (функция)

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

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

 < html >
 
< head >
    < style >
        span {
            display: none;
        }
         
        body {
            width: 35%;
            height: 50px;
            border: 2px solid green;
            padding: 35px;
            margin: 10px;
        }
    </ style >
    < script src = " https://code.jquery.com/jquery-1.10.2.js " >
    </ script >
 </ head >
 
< body >
    <!-- this paragraph element get focused -->
    < p >
        < input type = "text" > < span >focused</ span ></ p >
 
    <!-- jQuery cdee to show working of this method -->
    < script >
        $("input").focus(function() {
            $(this).next("span").css("display", "inline");
        });
    </ script >
 
</ body >
 
</ html > 

Выход:
Перед щелчком мыши внутри поля ввода -

После щелчка мышью внутри поля ввода с текстом «GeeksforGeeks» -

Код №2:
В приведенном ниже коде этому методу не передаются параметры.

 < html >
 
< head >
    < style >
        span {
            display: none;
        }
         
        body {
            width: 30%;
            height: 50px;
            border: 2px solid green;
            padding: 35px;
            margin: 10px;
        }
    </ style >
    < script src = " https://code.jquery.com/jquery-1.10.2.js " >
    </ script >
 </ head >
 
< body >
    <!-- this paragraph element get focused -->
    < p >
        < input type = "text" > < span >focused</ span ></ p >
 
    <!-- jQuery code to show working of this method -->
    < script >
        $("input").focus();
    </ script >
 
</ body >
 
</ html > 

Выход:
Прежде чем щелкнуть мышью внутри поля ввода -

После щелчка мышью внутри поля ввода с текстом «GeeksforGeeks» -

JavaScript JQuery

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

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