Определить, какой вход формы сосредоточен с использованием JavaScript или jQuery

Question

Как вы определяете, какой вход формы сосредоточен с использованием JavaScript или jQuery?

Изнутри функции я хочу, чтобы определить, какой вход формы имеет фокус. Я хотел бы иметь возможность сделать это в прямом JavaScript и/или jQuery.

Answer 1

Я не уверен, что это самый эффективный способ, но вы можете попробовать:

var selectedInput = null; 
$(function() { 
    $('input, textarea, select').focus(function() { 
     selectedInput = this; 
    }).blur(function(){ 
     selectedInput = null; 
    }); 
}); 

Answer 2

Если все, что вы хотите сделать, это изменить CSS для определенного поля формы, когда он получает фокус, вы можете использовать селектор CSS: «focus». Для совместимости с IE6, который не поддерживает это, вы можете использовать библиотеку IE7.

Answer 3

document.activeElement, это было поддержано в IE в течение длительного времени и в последние версии FF и поддержки хромированного он также , Если ничего не имеет фокуса, он возвращает объект document.body.

Answer 4

Попробуйте

window.getSelection().getRangeAt(0).startContainer 

Answer 5

В противном случае, вы можете использовать OnFocus и ONBLUR события.

что-то вроде:

<input type="text" onfocus="txtfocus=1" onblur="txtfocus=0" /> 

, а затем что-то вроде этого в вашем JavaScript

if (txtfocus==1) 
{ 
//Whatever code you want to run 
} 

if (txtfocus==0) 
{ 
//Something else here 
} 

Но это было бы просто мой способ сделать это, и это может быть не очень практично, если вам есть, скажем, 10 входов :)

Answer 6

Я бы сделал это следующим образом: я использовал функцию, которая вернет 1, если идентификатор отправленного элемента был тем, который вызвал бы мое событие, и все остальные s будет возвращать 0, а «если» заявление будет затем просто упасть Проходная и не делать ничего:

function getSender(field) { 
    switch (field.id) { 
     case "someID": 
     case "someOtherID": 
      return 1; 
     break; 
     default: 
      return 0; 
    } 
} 

function doSomething(elem) { 
    if (getSender(elem) == 1) { 
     // do your stuff 
    } 
    /* else { 
     // do something else 
    } */ 
} 

HTML Markup:

<input id="someID" onfocus="doSomething(this)" /> 
<input id="someOtherID" onfocus="doSomething(this)" /> 
<input id="someOtherGodForsakenID" onfocus="doSomething(this)" /> 

Первые два будут делать это событие в DoSomething, последнее не будет (или будет делать предложение else, если оно не выполнено).

-Tom

Answer 7

Вот решение для текста/пароля/текстового поля (не уверен, если я забыл другие, которые могут получить фокус, но они могут быть легко добавлены, изменив если положений ... улучшение может быть сделано на дизайне, поместив тело if в его собственную функцию, чтобы определить подходящие входы, которые могут получить фокус).

Предполагая, что вы можете положиться на пользователя, пользующегося браузером, который не является доисторическим (http: //www.caniuse.ком/# Подвиг = набор данных):

 <script> 
     //The selector to get the text/password/textarea input that has focus is: jQuery('[data-selected=true]') 
     jQuery(document).ready(function() { 
      jQuery('body').bind({'focusin': function(Event){ 
       var Target = jQuery(Event.target); 
       if(Target.is(':text')||Target.is(':password')||Target.is('textarea')) 
       { 
        Target.attr('data-selected', 'true'); 
       } 
      }, 'focusout': function(Event){ 
       var Target = jQuery(Event.target); 
       if(Target.is(':text')||Target.is(':password')||Target.is('textarea')) 
       { 
        Target.attr('data-selected', 'false'); 
       } 
      }}); 
     }); 
    </script> 

Для доисторических браузеров, вы можете использовать уродливее:

 <script> 
     //The selector to get the text/password/textarea input that has focus is: jQuery('[name='+jQuery('body').data('Selected_input')+']') 
     jQuery(document).ready(function() { 
      jQuery('body').bind({'focusin': function(Event){ 
       var Target = jQuery(Event.target); 
       if(Target.is(':text')||Target.is(':password')||target.is('textarea')) 
       { 
        jQuery('body').data('Selected_input', Target.attr('name')); 
       } 
      }, 'focusout': function(Event){ 
       var Target = jQuery(Event.target); 
       if(Target.is(':text')||Target.is(':password')||target.is('textarea')) 
       { 
        jQuery('body').data('Selected_input', null); 
       } 
      }}); 
     }); 
    </script> 

Answer 8

Вам нужно только один слушатель, если вы используете событие кипящий (и привязать его к документ); один в форме разумно, хотя:

var selectedInput = null; 
$(function() { 
    $('form').on('focus', 'input, textarea, select', function() { 
     selectedInput = this; 
    }).on('blur', 'input, textarea, select', function() { 
     selectedInput = null; 
    }); 
}); 

(. Может быть, вы должны переместить переменную selectedInput в форме)

Answer 9

Вы можете использовать этот

<input type="text" onfocus="myFunction()"> 

Это вызывает функцию, когда вход фокусируется.