jquery限制添加部分 View

Question

我觉得他的很简单，但我不知道为什么代码不起作用。

我使用部分 View 在 View 中动态添加文本框，但我想添加对要添加的行数的限制。下面是我的代码，但它不限制要添加的行数。

请帮忙，提前致谢。

@section Scripts {
@Scripts.Render("~/bundles/jquery")
<script>
    $("#btnAdd").on('click', function () {
        var counter = 0;

        if (counter > 5) {
            alert("Limit Exceeds");
            return false;
        }
        else {
            $.ajax({
                async: false,
                url: '/Employee/Add'
            }).success(function (partialView) {
                $('#Add > tbody').append("<tr>" + partialView + "</tr>");
            });
        }

        counter++;
    });

    function deleteRow() {
        var par = $(this).parent().parent();
        par.remove();
    };
    $("#Add").on("click", ".BtnRemove", deleteRow);
</script> }

Answer 1

尝试为变量提供全局范围，如果您想在删除行时减少计数，可以在删除行时将计数器减一。

var counter = 0;//<-- give the variable global scope

$("#btnAdd").on('click', function () {


        if (counter > 5) {
            alert("Limit Exceeds");
            return false;
        }
        else {
            $.ajax({
                async: false,
                url: '/Employee/Add'
            }).success(function (partialView) {
                $('#Add > tbody').append("<tr>" + partialView + "</tr>");
            });
        }

        counter++;
    });

    function deleteRow() {
        var par = $(this).parent().parent();
        par.remove();

        //Remove comment to decrease counter by one
        //counter--;

    };
    $("#Add").on("click", ".BtnRemove", deleteRow);