JQuery的文本框里面输入时隐藏错误的div

我有错误的div当表单提交到服务器，将出现，JQuery的文本框里面输入时隐藏错误的div

<p> 
    <input id="first_name" class="form-control" type="text" name="first_name" onkeyup="remove_error()" placeholder="First Name"> \ 
    <span id="error_first_name" class="err alert alert-danger"> 
     The first name may only contain letters. 
     <br> 
     The first name must be at least 2 characters. 
    </span> 
</p>

我有这样的代码：

$("#first_name").keyup(function(e) 
{ 
    $("#error_first_name").fadeOut(); 
});

我计划将其更改为

<input id="first_name" class="form-control" type="text" name="first_name" onkeyup="remove_error()"placeholder="First Name">

这样我就可以调用一个函数，它将删除与'err'相同的div中的错误，类。这是可行的，如果我将所有输入项目1键入1，我怎样才能使它成为一个功能，我可以打电话，并删除所述的div？

function remove_error() 
    { 
     $(this).next(".err").fadeOut(); //get next div with err class and fadeout 
    }

来源

2014-11-01 Ponce

我拿到了自举样本中的div标签。如果我切换它跨越它变得giberish – Ponce 2014-11-01 10:51:31

你可以定义一个类为你的元素，它的验证，然后使用同级淡出对KEYUP验证元素

$(".validate").keyup(function (e) { 
    console.log($(this).siblings('.validator')); 
    $(this).siblings('.validator').fadeOut(); 
});

检查此琴

http://jsfiddle.net/mfarouk/6vgnfam7/

来源

2014-11-01 10:59:40 mfarouk

我将使用这一个。感谢其他答案。 – Ponce 2014-11-01 11:13:57

@Ponce'.siblings（）'不是你所表达的问题的正确选择。它会搜索整个父级匹配的元素，而实际上您只想访问以下元素。不必要的DOM遍历是一种不好的做法。此外，它不回答如何使用内联处理程序或为什么你不应该使用它。顺其自然的答案完全取决于你。 – 2014-11-01 11:31:09

最好不要使用内联事件处理程序。你可以使用一个通用类的文本框，并做到：

$(".commonClass").keyup(function(e){ 
    $(this).next(".err").fadeOut(); 
});

如果必须使用内嵌处理器，那么你应该使用this关键字传递到元素的引用：

<input id="first_name" class="form-control" type="text" name="first_name" onkeyup="remove_error(this)"placeholder="First Name">

而且

function remove_error(elm){ 
    $(elm).next(".err").fadeOut(); //get next div with err class and fadeout 
}

：你可以在函数中使用它

阅读：Why is inline event handler attributes is a bad idea in modern semantic HTML?

来源

2014-11-01 10:54:30

这似乎没有工作。。 \t \t \t $（ “remove_err_onkeyup”）KEYUP（函数（e）中{ \t \t \t \t \t \t \t \t $（本）的.next（）淡出（） '犯错。'; \t \t \t}）; – Ponce 2014-11-01 11:02:10

@Ponce它[似乎工作]（http://jsfiddle.net/6vgnfam7/1/）对我来说... – 2014-11-01 11:12:32

JQuery的文本框里面输入时隐藏错误的div

回答

相关问题