试图理解这个代码块

时间:2013-07-30 04:51:04

标签: jquery kendo-ui kendo-combobox

以下脚本呈现Kendo UI组合框控件所需的字段背景颜色。虽然这个脚本运行得很好,但我觉得很难理解它。

从我所知道的,它开始于附加自定义属性或方法 所谓的_input到剑道ui组合框对象,并分配到新的变量_originalFunction但不是使用这个变量,它在下一行再次使用这个链式对象,我没有真正得到并将返回的结果分配到这个 来自侦听事件的匿名函数。

一般来说,我真的不知道这个函数里面发生了什么以及返回的值是什么。

有人可以用我能理解的方式解释吗?

(function ($) {
    var _originalFunction = kendo.ui.ComboBox.fn._input;
    kendo.ui.ComboBox.fn._input = function (e) {
        var result = _originalFunction.call(this, e);
        if (this.input) {
            this.input.addClass('required');
        }
        return result;
    }
})(jQuery);

2 个答案:

答案 0 :(得分:1)

这里发生的事情是,来自剑道_input库的ComboBox已得到增强,可以在输入元素中添加类required

如果您在分配行中使用_originalFunction而不是kendo.ui.ComboBox.fn._input,那么您只需要更改局部变量_originalFunction的值,而不是kendo引用的函数

(function ($) {
    var _originalFunction = kendo.ui.ComboBox.fn._input; // store the original function to a variable so that it can be called later
    kendo.ui.ComboBox.fn._input = function (e) { // overwrite the _input  function
        var result = _originalFunction.call(this, e); // call the original function to apply default functionality
        if (this.input) { // additional functionality is added here
            this.input.addClass('required');
        }
        return result;
    }
})(jQuery);

原始方法接受单个参数,因此当我们调用原始方法时,我们需要使用与预期相同的上下文和参数,这就是行_originalFunction.call(this, e)的原因。但它最好写成_originalFunction.apply(this, arguments),因为它可以安全地防止该方法签名的任何未来变化

答案 1 :(得分:0)

这正在修改Kendo的ComboBox _input方法的行为。它将此函数的原始值保存在变量_originalFunction中,然后为函数提供新的定义。新定义调用原始方法,保存其结果,将required类添加到组合框的输入字段,然后返回保存的结果。