0

我试图阻止这个>> 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;
});
4

5 回答 5

2

You can empty the place holder first by using 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;
});
于 2012-05-08T03:28:50.533 回答
1

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

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

    ...
});
于 2012-05-08T03:28:00.827 回答
1

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

于 2012-05-08T03:28:29.817 回答
1

As I can see it the best/neat way of doing it is to create an element with an id like "errors_" + this.name and then update that element with the text that you would like to show:

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")

Hope this helps :-)

于 2012-05-08T03:41:02.597 回答
1 
$("#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;
});
于 2012-05-08T03:52:58.393 回答