这个jQuery函数有什么问题？

我有这个jQuery事件处理程序代码，我想把它转换成一个函数

$("#activate-user").click(function() {
    var userId = [];
    $(':checkbox:checked').each(function(i) {
        userId[i] = $(this).val();
    });
    if(userId.length == 0) {
        //If userId is empty
    } else {
        $.ajax({
            type: 'POST',
            url:  'process.php',
            data: 'option=activate&userId='+userId,
            success: function(msg){
                if(msg == 0) {
                    //If cannot process the query.
                } else {
                    //If query is processed.
                    location.reload(true);
                }
            }
        });
    }   
});

$("#block-user").click(function() {
    var userId = [];
    $(':checkbox:checked').each(function(i) {
        userId[i] = $(this).val();
    });
    if(userId.length == 0) {
        //If userId is empty
    } else {
        $.ajax({
            type: 'POST',
            url:  'process.php',
            data: 'option=block&userId='+userId,
            success: function(msg){
                if(msg == 0) {
                    //If cannot process the query.
                } else {
                    //If query is processed.
                    location.reload(true);
                }
            }
        });
    }
});

这两个事件处理程序之间的唯一区别是一个值，即

option=

data:'option=activate&userId='+userId

data:'option=block&userId='+userId

我想把它转换成jQuery函数，我试着这样做，但根本不起作用

(function ($) {
jQuery.fn.userOperation = function(opString) {
    this.click(function() {
        var userId = [];
        $(':checkbox:checked').each(function(i){
            userId[i] = $(this).val();
        });
        if(userId.length === 0) {
            //If userId is empty.
        } else {
            $.ajax({
                type: 'POST',
                url:  'process.php',
                data: 'option='+opString+'&userId='+userId,
                success: function(msg){
                    if(msg == 0) {
                        //If cannot process the query.
                    } else {
                        //If query is processed.
                        location.reload(true);
                    }
                }
            });
        }
    });
}
}(jQuery));

jQuery函数调用：

$('#activate-user').userOperation(function() {
    return 'block';
});

这似乎不起作用，因为我没有将参数正确地传递给函数，因为我是jQuery的新手，我不确定如何做到这一点。我哪里做错了？将参数传递到jQuery函数中的正确可行方法是什么

---

谢谢..

首先，您正在将一个函数传递给

userOperation

，但它需要一个字符串

与此相反：

$('#activate-user').userOperation(function() {
    return 'block';
});

这样做：

$('#activate-user').userOperation('block');

---

首先，您将函数传递给

userOperation

，但它需要一个字符串

与此相反：

$('#activate-user').userOperation(function() {
    return 'block';
});

这样做：

$('#activate-user').userOperation('block');

数据参数需要一个sting，并且您的参数生成数据参数，因此将您想要执行的操作传递给它，即字符串

数据参数需要一个sting，而您的参数生成数据参数，因此将您要执行的操作（即字符串）传递给它。

我的出价：

// use an anonymous function to we can still reference the short version
//  of jQuery ($) even in situations where $.noConflict() was applied.
(function($){

    // extending the $.fn is saying "We want to add a function as part of jQuery"
    $.fn.extend({

        // here's the new function we're adding:
        // $(selector).userOperation(action);
        userOperation: function(action){

            // return an each iterator so we can bind to multiple selectors
            // and so we can chain (e.g. $('#foo,#bar).userOperation('delete').show();)
            return this.each(function(i,e){

                // grab the current element and bind to its click event
                $(e).click(function(){

                    // go through the checked boxes and find userIds we're working on
                    // map() makes this easy because it will go through each found item,
                    // process it (in this case return only it's value) then return those
                    // results as an object. Then, we call toArray() so all we have is an
                    // array full of those found values.
                    var userId = $(':checkbox:checked').map(function(i,el){
                      return $(el).val());
                    }).toArray();

                    // check if we have userId entries
                    if (userId.length > 0){

                        // we have entries, fire off the AJAX call
                        $.ajax({
                            type: 'POST',
                            url: 'resources/library/models/users/process.php',
                            data: 'option='+action+'&userId='+userId.join(','),
                            success: function(msg){
                                if (msg == 0){
                                    // cannot process
                                }else{
                                    location.reload(true);
                                }
                            }
                        });
                    }else{
                        // userId array is empty
                    }

                    // block action, in case we bind click to anchors
                    e.preventDefault();
                });
            });
        }
    });

})(jQuery);

// this is how we would attach it to various elements:
$('#block').userOperation('block');
$('#activate').userOperation('activate');

还允许您绑定到多个选择器、使用链接等。我还显式调用

userId

数组上的

join

，而不允许javascript默认将数组转换为字符串。这对任何通过代码的人来说都更具可读性，IMHO。

我的出价：

// use an anonymous function to we can still reference the short version
//  of jQuery ($) even in situations where $.noConflict() was applied.
(function($){

    // extending the $.fn is saying "We want to add a function as part of jQuery"
    $.fn.extend({

        // here's the new function we're adding:
        // $(selector).userOperation(action);
        userOperation: function(action){

            // return an each iterator so we can bind to multiple selectors
            // and so we can chain (e.g. $('#foo,#bar).userOperation('delete').show();)
            return this.each(function(i,e){

                // grab the current element and bind to its click event
                $(e).click(function(){

                    // go through the checked boxes and find userIds we're working on
                    // map() makes this easy because it will go through each found item,
                    // process it (in this case return only it's value) then return those
                    // results as an object. Then, we call toArray() so all we have is an
                    // array full of those found values.
                    var userId = $(':checkbox:checked').map(function(i,el){
                      return $(el).val());
                    }).toArray();

                    // check if we have userId entries
                    if (userId.length > 0){

                        // we have entries, fire off the AJAX call
                        $.ajax({
                            type: 'POST',
                            url: 'resources/library/models/users/process.php',
                            data: 'option='+action+'&userId='+userId.join(','),
                            success: function(msg){
                                if (msg == 0){
                                    // cannot process
                                }else{
                                    location.reload(true);
                                }
                            }
                        });
                    }else{
                        // userId array is empty
                    }

                    // block action, in case we bind click to anchors
                    e.preventDefault();
                });
            });
        }
    });

})(jQuery);

// this is how we would attach it to various elements:
$('#block').userOperation('block');
$('#activate').userOperation('activate');

---

还允许您绑定到多个选择器、使用链接等。我还显式调用

userId

数组上的

join

，而不允许javascript默认将数组转换为字符串。IMHO，这对任何阅读代码的人来说都更具可读性。

大多数代码对我来说都是外星人：D，对不起，我是jQuery的新手，如果你能向我解释你的出价到底发生了什么，我将不胜感激：）@ibrahim：我刚刚为你评论了它。；-）大多数代码在我看来都是外星人：D，对不起，我是jQuery的新手，如果你能向我解释一下你的出价到底发生了什么，我将不胜感激：）@ibrahim:我刚刚为你评论了一下。；-）