如何将名称空间变量传递给click函数参数变量？ jQuery

Question

所以我发现一个awesome solution需要在jQuery中使用全局变量。我在任何地方都说命名空间，最初我打算使用Global var。

但是我无法通过一个简单的点击函数的参数发送我的命名空间变量。

我想这样做，因为我有这些变量需要保存并用于创建模式窗口以及让应用程序知道动态创建的按钮控制着什么模式。

所以，下面是我的命名空间对象的示例，我先创建变量 我的jQuery的命名空间对象：

$.reg = { 
    masterRole : " ", 
    role_ID : " ", 
    row_Name : " ", 
    ary_Check_Role : [] 
}; 

$(document).ready(function() { 
    ... 

当你经历当你点击这个对于那些命名空间变量的值获取设置应用程序按钮（从HTML争夺数据） 变量对我roleBtnClicked功能设置

function roleBtnClicked(event){ 

    $.reg.masterRole = $(this).html();   /* Get role name: Actor */ 
    $.reg.role_ID  = $(this).attr('role');  /* Get role-1 */ 
    $.reg.rowName  = $(this).attr('row');  /* Get row-role-1 */ 
    $.reg.blueBtn  = $(this).attr('blue');  /* Get blue-btn-1 */ 

现在模态窗口弹出，点击一些复选框和数据推到一个数组，当你后点击完成按钮（下面），所有的变量需要再次保存到命名空间变量中。

我完成按钮点击功能，在这里我想通过参数去把我的名字空间变量瓦尔

$(".doneButton").click(
    { 
     param1: $.reg.masterRole, 
     param2: $.reg.role_ID, 
     param3: $.reg.rowName, 
     param4: $.reg.ary_Check_Role 
    }, 
    doneBtnClicked); 

function doneBtnClicked(event){ 
    alert('$.reg.roleName = '+$.reg.roleName); 
    alert('event.data.param1 = '+event.data.param1); 

    masterRole= event.data.param1; 
    role_ID = event.data.param2; 
    rowName = event.data.param3; 
    ary_Check_Role = event.data.param4; 

---

注2个警报以上的点击功能，第一个会显示正确值，但是第二个不显示任何东西。此外还有一个问题让阵列来通过以及。

所以问题：我应该这样做吗？你如何正确地传递数组到一个jQuery名称空间，然后让它传递到一个单击函数参数？

Answer 1

首先，你应该避免把东西放入jQuery对象中。为此使用闭包。

第二：您应该使用HTML data-...属性和jQuery data()将自定义属性附加到HTML元素。避免使用非标准属性。

三：您可以使用单独命名的函数定义事件处理程序，但它使当你真正重新使用这些功能在你的代码的不同元素最有意义的（你似乎没有这样做）。例如，使用直接传递给.click()的匿名函数可以获得更易于理解的代码。

// use this shorthand instead of $(document).ready(function() { ... }); 
$(function() { 

    // variable reg will be available to all functions 
    // defined within this outer function. This is called a closure. 
    var reg = { 
    masterRole : " ", 
    role_ID : " ", 
    row_Name : " ", 
    ary_Check_Role : [] 
    }; 

    $(".roleButton").click(function (event) { 
    // modify state 
    reg.masterRole = $(this).html();   /* Get role name: Actor */ 
    reg.role_ID  = $(this).data('role');  /* Get role-1 */ 
    reg.rowName  = $(this).data('row');  /* Get row-role-1 */ 
    reg.blueBtn  = $(this).data('blue');  /* Get blue-btn-1 */ 

    // note that this requires markup like this: 
    // <button data-role="foo" data-row="bar" data-blue="baz"> 

    // ... 
    }); 

    $(".doneButton").click(function (event) { 
    // debug output 
    alert(JSON.stringify(reg, 2, 2)); 
    }); 

}); 

使用多个$(function() { ... });块来区分应该分开的东西。

不要忘记对每个声明的变量总是使用var。声明为var的变量将是全局变量 - 而且您不需要全局变量。