Question

我正在创建一个表单。在为每个输入字段提交表单时，如果未填充该输入字段，则会附加一个错误框。我想删除或显示该输入字段的错误框onFocus.While在我的代码中将保留在该位置。我试过，我经历了所有类似的帖子，但无法找到解决方案。谢谢！

html代码就像

<div class="rowform">
        <label for="name">Name<span>*</span>:</label>
        <input type="text" class="mid" name="name" id="name" onFocus="fcs();"/><span id="name_error"></span>

    </div>

脚本 //提交表单我如何追加错误框

if($("#listcontact #name").val()==""){
    $("#name_error").append("<div class='formerror'>Please enter your name</div>");
}

//焦点功能就像

    function fcs()
{
$(".formerror").remove();}

Answer 1

类似的东西：

$(".rowform").on("focus", "input", function(){
    $(this).closest(".rowform").find(".formerror").hide();
});

更新：确实不需要像Ian那样的事件委托。

$(".rowform").find('[type="text"]').on("focus", function(){
    $(this).closest(".rowform").find(".formerror").hide();
});

工作小提琴：http://jsfiddle.net/Ar7AT/

Answer 2

尝试以下

$("#name").focus(function(){
    $(".formerror").remove();
});

$("#btn").on("click",function(){

 $(".formerror").remove();

 if($("#name").val()==""){  
    $("#name_error").append("<div class='formerror'>Please enter your name</div>");
 }
});

在这里工作小提琴：http://jsfiddle.net/fzS95/1/

我希望它有所帮助。

Answer 3

您可以使用。remove()代替.hide()

$(".rowform").on("focus", "input", function(){
    $(this).closest(".rowform").find(".formerror").remove();
});

Answer 4

我不确定你是如何实现它的，但是，我希望这会有所帮助：

<div class="rowform">
    <label for="name">Name<span class='name-check'>*</span>:</label>
    <input type="text" class="mid" name="name" id="name" onFocus="fcs('name', this);"/><span id="name_error"></span>
</div>

<script>
    function fcs(err,obj) {
        if( $(obj).val() == "" ) {
            $("." + err + "-check").show();
        }
        else {
            $("." + err + "-check").hide();
        }
    }
</script>

如何使用jquery删除附加元素？

4 个答案: