jQuery常用代码... MVC3 App

时间:2011-12-01 19:53:58

标签: javascript jquery encapsulation

我有一个C#.NET MVC3网络应用程序,我在我的网页上有一些常见的jQuery功能,并希望模块化它。我不知道该怎么做。下面是我正在使用的代码示例。您会注意到有几个控件具有分配给事件的功能。我有的每个视图都会这样做,但控件(和控件数量)会有所不同。可能有1个控件需要添加事件,或者可能有10个。

$(document).ready(function () {
    $("#Description").keyup(function () {
        disableEnableSave();
    });
    $("#DueDate").change(function () {
        disableEnableSave();
    });
    $("#EndDate").keyup(function () {
        disableEnableSave();
    });
});

下面是disableEnableSave()代码。类似的问题,在该代码中,可能有1个控件可以对抗或10个。

    function disableEnableSave() {
        var text = $("#Description").val();
        var text1 = $("#DueDate").val();
        var text2 = $("#EndDate").val();
        var textlength = text.length;
        var textlength1 = text1.length;
        var textlength2 = text2.length;
        if (textlength > 0 && textlength1 > 0 && textlength2 > 0) {
            $("#thePageSubmit").removeAttr("disabled");
        }
        else {
            $("#thePageSubmit").attr("disabled", "disabled");
        }
        document.title = document.title.replace("*", "");
        document.title = document.title + "*";
        return true;
    }

我不是jQuery或JavaScript专家,但我认为有一种方法可以将其封装在.js文件中并传入一些参数。任何想法?

1 个答案:

答案 0 :(得分:1)

现场演示:http://jsfiddle.net/g3azJ/3/

$.fn.disableFalseInput = function(list) {
    var _this = $(this),
        required = $(list);

    required .bind("keyup change", function() {
        var available = true;
        $.each(required , function(k, v) {
            if (v.value.length == 0) {
                available = false;
                return false;
            }
        });
        if (available) {
            _this.removeAttr("disabled")
        } else {
            _this.attr("disabled", "disabled");
        }
    }).first().trigger("keyup");
}

根据需要定义需要输入的按钮:

$("#thePageSubmit").disableFalseInput("#Description, #DueDate, #text2");

#thePageSubmit是将被禁用的提交按钮,参数是所需的字段。这可以在每个按钮上使用,也可以在你得到的任何东西上使用。