javascript - 如何防止用户一次又一次重新提交相同的搜索条件

Question

我有以下 JavaScript 来防止用户在不更改文本 (SearchString) 或组合框 (SearchType) 的情况下重新提交相同的搜索条件。 EnableSubmit 可以工作，但有一个问题:当用户添加然后删除空格时，EnableSubmit 会崩溃。

我尝试将最后一个条件的值保留在 LastChange 变量中。然后当他们再次提交时，就会弹出警告框。警报关闭后，代码看起来就像正在提交，然后他们可以使用之前相同的条件重新单击“提交”。问题是，如何在警报框关闭后将 LastChange 保持为相同的值。

<script type="text/javascript">

    var LastChange;

    $("#SearchString").change(function () { EnableSubmit();});
    $("#SearchString").keyup(function () { EnableSubmit(); });
    $("#SearchType").change(function () { EnableSubmit(); })

    function EnableSubmit () { $("#SubmitButton").removeAttr("disabled"); $("#SubmitButton").attr("value", "Search"); }

    $(function () {

    $("#StarForm").submit(function (e) { 

        $("#SubmitButton").attr("disabled", true);
        $("#SubmitButton").attr("value", "Submit disabled until you change search criteria.");

        if (LastChange == ($("#SearchString").val())) {
            alert('Please change the search criteria before resubmitting.');
            LastChange = ($("#SearchString").val());

        }
        else {

            LastChange = ($("#SearchString").val());



            var FormData = '{ "SearchString": "' + $('#SearchString').val() + '",' +
                '"SearchType" : "' + $('#SearchType').val() + '"' +
                '}';
            e.preventDefault();

        }

    });

});
</script>

Answer 1

也许将启用/禁用逻辑放入更改处理程序中，并仅在提交处理程序中设置最后一个搜索条件。

也许是这样的？

$(function () {
    var lastSearchText;
    var lastSearchType;

    $("#SearchString").change(function () { onSearchChanged();});
    $("#SearchString").keyup(function () { onSearchChanged(); });
    $("#SearchType").change(function () { onSearchChanged(); })

    function onSearchChanged () { 

        var searchText = $("#SearchString").val().trim();
        var searchType = $('#SearchType').val();

        if (searchText !== lastSearchText || searchType !== lastSearchType) {
            $("#SubmitButton").removeAttr("disabled");
            $("#SubmitButton").attr("value", "Search"); 
        }
        else {
            $("#SubmitButton").attr("disabled", true);
            $("#SubmitButton").attr("value", "Submit disabled until you change search criteria.");
        }
    }         

    $("#StarForm").submit(function (e) { 
        lastSearchText = $("#SearchString").val().trim();
        lastSearchType = $('#SearchType').val();
        onSearchChanged();
    });
});