Question

我试图阻止这个＆gt;＆gt; http://jsfiddle.net/justmelat/8x2WX/

如果您查看我的jsfiddle，请单击必填字段按钮，再次单击它。你会看到它一直在追加[代码要求它做的事情]那些空的字段。

有什么更好的方法可以做到这一点？如果用户碰巧点击了按钮两次，或者当他们填写表单并进行测试以查看剩下的内容时，我希望它重新启动已验证文本的显示，而不是追加。我尝试了text（）和html（），但它们无法正常工作。

$("#section-11,#section-12,#section-13,#section-1011").hide();

var projtype = new Array(
        {value : 'Cars', sect_id : 'fieldset#section-11'},
        {value : 'Planes', sect_id : 'fieldset#section-12'},
        {value : 'Boats', sect_id : 'fieldset#section-13'}
    );
$("select#1169").on('change',function () {
var thisVal = $(this).val();
 var sect_id ="";
     //$('fieldset[id!="mainSection"]').hide();
    $(projtype).each(function() {
$(this.sect_id).hide();
        if(this.value == thisVal) {
        $(this.sect_id).show();
        }
    });        
});

$("#btnCatchReqFlds").on('click', function() {
    //$("#holdErrMsg").append(" ");
    var requiredButEmpty = $("fieldset:visible").find('input[class*="-required"], select[class*="-required"]').filter(function() {
      return $.trim($(this).val()) === "";  
    });
    if (requiredButEmpty.length) {
        requiredButEmpty.each(function () {

            $("#holdErrMsg").append("Please fill in the " + this.name + "<br />");
        });
    }
    return !requiredButEmpty.length;
});

Answer 1

您可以先使用empty()

清空占位符

$("#btnCatchReqFlds").on('click', function() {
    //$("#holdErrMsg").append(" ");
    $("#holdErrMsg").empty();
    var requiredButEmpty = $("fieldset:visible").find('input[class*="-required"], select[class*="-required"]').filter(function() {
      return $.trim($(this).val()) === "";  
    });
    if (requiredButEmpty.length) {
        requiredButEmpty.each(function () {

            $("#holdErrMsg").append("Please fill in the " + this.name + "<br />");
        });
    }
    return !requiredButEmpty.length;
});

Answer 2

为什么不在验证开始时清除#holdErrMsg？

$("#btnCatchReqFlds").on('click', function() {
    $("#holdErrMsg").empty();

    ...
});

Answer 3

http://jsfiddle.net/8x2WX/3/ 试试这个，我在运行错误检查之前清空错误框。

Answer 4

我可以看到最好/最好的方法是创建一个id为“errors_”+ this.name的元素，然后使用你想要显示的文本更新该元素：

var errorElementId = "errors_" + this.name;
if($('#'+errorElementId).length > 0) {
    var errorElement = document.createElement("p");
    errorElement.setAttribute("id", errorElementId);
    $("#holdErrMsg").append(errorElement);
} else {
    errorElement = $(errorElementId)
}
errorElement.text("Your fancy error string")

希望这会有所帮助： - ）

Answer 5

$("#btnCatchReqFlds").on('click', function() {
    //$("#holdErrMsg").append(""); not necessary
    var requiredButEmpty = $("fieldset:visible").find('input[class*="-required"], select[class*="-required"]').filter(function() {
      return $.trim($(this).val()) === "";  
    });
    if (requiredButEmpty.length) {
        $("#holdErrMsg").empty(); // empty the message holder
        requiredButEmpty.each(function () {

            $("#holdErrMsg").append("Please fill in the " + this.name + "<br />");
        });
    }
    return !requiredButEmpty.length;
});

Jquery：如何停止在onClick上附加我的文字？

5 个答案: