Установить фокус на текстовое поле, если пользователь оставляет его - PullRequest
Новая
       5

Установить фокус на текстовое поле, если пользователь оставляет его

0 голосов
/ 16 марта 2011

В настоящее время я нахожусь в тупике в лаборатории, которую я должен завершить.Мне нужно сделать онлайн-сайт, который определяет стоимость серебряных монет (используя localhost с xampp).Часть лаборатории, в которой я застрял, - это то, где я должен проверить, есть ли значение в текстовом поле, когда пользователь покидает его.Если нет, мне нужно вывести и предупредить и установить фокус обратно на это текстовое поле.Я не могу найти способ заставить фокус работать, используя «это».Я должен также упомянуть, что есть четыре флажка, и каждое текстовое поле принадлежит соответствующему флажку.

Функция размытия - это то, где я не могу заставить фокус работать. 

$(function() 
{

    $(":checkbox").click(function()
    {   
        if($(this).attr("checked"))
            $(this).parent().siblings().children().attr("disabled", false).focus();
        else
            $(this).parent().siblings().children().attr("disabled", true).val("");
    });

    $(":text").blur(function()
    {
        if($(this).val() == "")
        {
            alert("Please enter a value");
            $(this).focus();
        }
    });

    $("#btnEnter").click(function()
    {
        if($(":checkbox:checked").val())
            $("form").submit();
        else
            alert("No coin types were selected");
    });
});

Ответы [ 2 ]

0 голосов
/ 16 марта 2011

Нашел проблему.Мне нужно, чтобы сбросить фокус на текстовое поле, но потому что я использую событие щелчка флажок, когда я нажимаю что-то ещеМне нужно было сделать задержку с установленным тайм-аутом, но это заставляет забыть, что означает «это».Решение состоит в том, чтобы создать переменную вне цикла, которая захватывает идентификатор элемента, на который я ссылаюсь.

$(":text").blur(function()
{
    var ID = $(this).attr("id");

    if($(this).val() == "")
    {
        alert("Please enter a value");
        setTimeout(function()
        {
            $("#" + ID).focus();
        }, 50);
    }
});
0 голосов
/ 16 марта 2011

Я бы предложил добавить некоторые идентификаторы или классы в ваш HTML, чтобы сделать вашу жизнь намного проще.Это облегчит разграничение флажков в вашем HTML, CSS и JS.Кроме того, гораздо проще получить доступ к объекту DOM в Javascript с помощью идентификатора или класса, чем пытаться карабкаться вверх и вниз по дереву DOM повсюду и полностью теряться в процессе.

С учетом сказанного я бы предложилИдентификация флажков и текстовых полей аналогичным образом.Например: 

checkbox id="silver1".....input type="text" id="silver1num" value=""

Таким образом

if ($ ("# silver1"). Check & $ ("# silver1num"). Value == "") {

  MsgBox.........
  $("#silver1num").focus();

}

Вы можете даже перебирать каждый флажок и сокращать еще немного кода.Добавьте класс «silvercoin» к каждому флажку. 

$(".silvercoin").each(function(){
    if( $(this).checked && $( "#"+$(this).attr(id)+"number") ).value == "" ) {
        MsgBox......
        $(this).attr(id)+"number").focus();
    }
});

Примечание: $ ("#" + $ (this) .attr (id) + "number")) извлекает идентификатор из флажка- «silver1» и добавляет к нему «число», чтобы получить «# silver1number», который является идентификатором соответствующего поля ввода.

Я просто набрал весь этот код из памяти, так что я мог бы напечатать вещьили два, но концепция одна и та же, тем не менее.Прошёл месяц или два с тех пор, как я играл с jQuery.

...