如何将命名空间变量传递给click函数param变量? jQuery的

时间:2013-05-01 22:32:35

标签: javascript jquery variables namespaces parameter-passing

所以我发现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个警报,第一个将显示正确的值,但第二个不显示任何内容。同样在让阵列通过时也遇到了问题。

所以问题:我应该这样做吗?如何正确地将Array传递到jQuery命名空间,然后将其传递给click函数参数?

1 个答案:

答案 0 :(得分:2)

首先,您应该避免将内容放入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的情况下声明的变量将是全局的 - 您不需要全局变量。