2014-10-13 5 views
4

Я пытаюсь создать функцию, которая будет смотреть на имя пользователя, если оно недействительно, отправить предупреждение пользователю, очистить поле имени пользователя и поместить поле имени пользователя в фокус. Я пытаюсь сделать все это с помощью функции getElementsBynName(). Все это работает, за исключением того, что поле возвращается в фокус. Мой код ниже. У кого-нибудь есть предложения.javascript, getelementbyname и focus

function uchecker(uname) 
{ 
var validUname = uname.search(/^\[email protected]$/); 
if(validUname != 0) 
{ 
    alert("You have entered an invalid username. \n The username must be a valid @sju.edu email address value " + document.getElementsByName('uname')[0].value); 
    document.getElementsByName('uname')[0].value = null; 
    document.getElementsByName('uname')[0].focus(); 

    /I have also tried document.getElementsByName('uname').focus, document.getElementsByName('uname')[0].value.focus(); 
} 

}

Получается, что до того, как сценарий Java запускает поле, которое находится в фокусе изменений в следующем поле ввода пароля мой ящик ... который также имеет свою собственную функцию проверки. У меня есть способ получить код javascript для моего поля имени пользователя до того, как следующий текстовый блок (окно с паролем) будет сфокусирован?

+1

Это 'document.getElementsByName ('uname') [0] .focus()' Я думаю. – gab06

+0

Я пробовал это без везения – Brian

+0

Возможно, это не попытка попробовать пустую строку в поле ввода вместо null: 'document.getElementsByName ('uname') [0] .value = ''' и использовать 'focus() '. – gab06

ответ

0

Вероятно, у вас есть элементы управления в форме, как:

<form ...> 
    Username: <input type="text" name="uname" onblur="uchecker(this)"> 
    <span id="unameMsg"></span> 
    <br> 
    Password: <input type="password" name="password"> 
    ... 
</form> 

поэтому функция проверки может быть:

function uchecker(element) { 

    // If fail validation, show message, clear input, return focus  
    if (!/^\[email protected]$/.test(element.value)) { 
    document.getElementById(element.name + 'Msg').innerHTML = 'You have entered an invalid username. ...'; 
    element.value = ''; 
    element.focus(); 

    // Otherwise, clear message 
    } else { 
    document.getElementById(element.name + 'Msg').innerHTML = ''; 
    } 
} 

Но это блокирует пользователя в заполнении поля имя пользователя, прежде чем быть в состоянии сделать что-нибудь остальное.

1

JavaScript:

document.getElementsByName ('имя') [0] .focus()

Jquery:

$ ("# имя ") [0] .фокус()

function valid(){ 
 
    var nameObj = document.getElementsByName("testing"); 
 
    for(var i=0; i<nameObj.length; i++){ 
 
    if(nameObj[i].value == ""){ 
 
     //$(nameObj)[i].focus(); //Jquery 
 
     nameObj[i].focus();  //Js 
 
     alert("Please Fill all the text boxes"); 
 
     break; 
 
    } 
 
    } 
 
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<style> 
 
.input-sm{ 
 
    width:200px 
 
} 
 
</style> 
 
<input name="testing" class="form-control input-sm" type="text" id="test_01"/><br> 
 

 
<input name="testing" class="form-control input-sm" type="text" id="test_02"/><br> 
 
<input name="testing" class="form-control input-sm" type="text" id="test_03"/><br> 
 
<input name="testing" class="form-control input-sm" type="text" id="test_04"/><br> 
 
<input type="button" class="btn btn-primary" onclick ="valid()" value="Click Me"/>

0

Я считаю, что это может быть решение вашей проблемы:

function onUnameFocus() { 
 
    var uname = document.getElementsByName("uname")[0]; 
 

 
    uname.onblur = function() { 
 
     var isValidUname = uname.value.search(/^\[email protected]$/); 
 

 
     if (uname.value !== "" && isValidUname) { 
 
      uname.onblur = null; 
 
      alert("You have entered an invalid username. \n The username must be a valid @sju.edu email address value " + uname.value); 
 
      uname.value = ""; 
 
      setTimeout(function() { uname.focus(); }, 1); 
 
     } 
 
    } 
 
};
<input name="uname" onfocus="onUnameFocus()" />

Он устанавливает OnFocus ручку, которая, в свою очередь устанавливает в ONBLUR ручку. Это делается для предотвращения бесконечного цикла цикла, когда он обнаружил недопустимое имя пользователя.

Он также проверяет, пустое ли поле uname, чтобы не попасть в ловушку пользователя там, где не было выбрано ни одного имени пользователя. И это добавляет небольшую задержку к событию фокуса, чтобы гарантировать, что он срабатывает после закрытия окна предупреждения.

Эти сценарии были протестированы на Chrome, Firefox и Internet Explorer 11.