jquery中必需属性的事件

Question

我真的无法正确解释这个，所以这是一个截图：

如果在Firefox上的电子邮件字段周围出现此红色突出显示，我该如何捕获事件。这样我就能做点什么。下面的代码只是一个混合了一些正式代码的伪代码：

 <script src="jq.js"></script>
    <script>
    $(function(){

        $('#btn_yo').click(function(){
            $('input').each(function(index){
                if($(this:required == 'true'){
                    //do something
                }
            });
        });
    });
    </script>
    <input type="text" name="name" id="name"  required/>
    <input type="email" name="mail" id="mail"/>
    <input type="button" id="btn_yo" value="submit"/>

电子邮件属性仅接受电子邮件属性，当您输入其他内容时，它会自动以红色边框突出显示。如何捕获该事件，以便我可以执行自定义操作，而不是默认的红色突出显示。

Answer 1

我认为您可能想要使用的是blur，这样当用户离开给定的输入字段时，您可以执行该字段的验证并在需要时将其标记为无效。例如：

$("input").blur(function(evt) {
    if (this.required && this.value == "") {
        alert(this.name + " is a required field!");
        $(this).addClass("error");
        this.focus();
    }
    else {
        $(this).removeClass("error");
    }
});

这给你这样的东西：http://jsfiddle.net/CJ5Zc/1/

Answer 2

$('#mail').focus(function(){

    alert('focused');
});