Set focus to a textbox if user leaves it

I'm currently stumped on a lab I have to complete. I need to make an online site that finds the value of silver coins (using localhost with xampp). The part of the lab I'开发者_开发技巧m stuck on is where I have to check to see if there's a value in a textbox when a user leaves it. If not I need to output and alert and set the focus back to that textbox. I can't find a way to get the focus working using "this". I should probably also mention that there are four checkboxes and each textbox belongs to a respective checkbox.

The blur function is where I can't get the focus to work.

$(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");
    });
});

---

I would suggest adding some ID's or Classes in your HTML to make you life far easier. It will make differentiating the check boxes easier in your HTML, CSS, and JS. Plus it's far easier to access a DOM object in Javascript with an ID or Class than trying to climb up and down the DOM tree all over place and getting totally lost in the process.

With that said, I would suggest IDing the checkboxes and textboxes in a similar way. For instance:

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

That way

if( $("#silver1").checked & $("#silver1num").value=="") {

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

}

You can even iterate over each checkbox even and cut down on some more code. Add a class of "silvercoin" to each checkbox.

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

Note: the $( "#"+$(this).attr(id)+"number") ) pulls the ID from the checkbox - "silver1" and appends "number" to it to give you "#silver1number" which is the id the corresponding input box.

I just typed up all this code from memory, so I might of mistyped a thing or two but the concept is the same never the less. It's been a month or two since I played with jQuery.

---

Found the problem. I need it to reset focus to the textbox but because I'm using the click event of the checkbox when I click something else. What I needed to do was make a delay with set time out, but this calls it to forget what "this" refers to. The solution is then to make a variable outside the loop which grabs the ID of the element I'm referring to.

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

    if($(this).val() == "")
    {
        alert("Please enter a value");
        setTimeout(function()
        {
            $("#" + ID).focus();
        }, 50);
    }
});