这个jQuery函数有什么问题？

Question

我有这个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=

1. data: 'option=activate&userId='+userId
2. data: 'option=block&userId='+userId值

我想这个把它转换成jQuery函数N代表我试图做这样它完全不工作，

(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函数的正确和可行的方法？

谢谢你..

Answer 1

我的出价：

// 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默认为铸造一个数组串。对于任何经历代码的人来说，这看起来更具可读性，恕我直言。

Answer 2

其一，你传递一个函数来userOperation，但它需要一个字符串。

取而代之的是：

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

这样做：

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

Answer 3

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

的数据参数需要刺痛你的论点使数据参数，因此通过它你想要的动作拿一个字符串IE。