如何将命名空间变量传递给click函数参数变量? jQuery的 [英] How to pass namespace variable into click function param variable? jQuery

问题描述

因此，我找到了一个很棒的解决方案来解决需要使用Global的问题jQuery中的变量.在任何我说名称空间的地方，最初我都会使用Global var.

So I found an awesome solution to get around needing to use Global variables in jQuery here. Everywhere I say namespace, originally I was going to use a Global var.

但是，我无法通过简单的click函数通过参数发送我的名称空间变量.

However I'm not able to send my namespace variable through a param on a simple click function.

我要这样做是因为我需要保存这些变量，并将它们用于创建模态窗口以及让应用程序知道哪些动态创建的按钮可以控制模态.

I want to do this because I have these variables that need to be saved and used to create modal windows as well as to let the app know what dynamically created buttons control what modal.

因此，下面是我首先创建变量的命名空间对象的示例 我的jQuery命名空间对象:

So below is an example of my namespace object where I first create the variables My jQuery namespace object:

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

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

当您浏览该应用程序时，单击此按钮时将设置这些名称空间变量的值(从HTML抓取数据) 在我的roleBtnClicked函数上设置了变量

As you go through the app the values for those namespace variables get set when you click this button (grabs data from HTML) Variables are set on my roleBtnClicked function

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 */

现在，在单击某些复选框并将数据推入数组后，将弹出一个模态窗口，当您单击完成"按钮(下面)时，所有变量都需要再次保存到命名空间vars中.

Now a modal window pops up, after clicking some checkboxes and pushing data into an array, when you click the done button(below) all the variables need to be saved into the namespace vars again.

我完成的按钮单击函数"，在这里我试图通过参数vars传递我的名称空间变量

My done button click Function, where I'm trying to pass my namespace variables via param vars

$(".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个警报，第一个将显示正确的值，但是第二个将不显示任何内容.另外，使阵列也无法通过.

---

Note the 2 Alerts above in the click function, the first one will display the correct value, however the 2nd one doesn't display anything. Also Having a problem getting the Array to come through as well.

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

So questions: Should I be doing it this way? How do you pass an Array into a jQuery namespace correctly and then get it passed into a click function param?

推荐答案

首先，您应该避免将事情放到jQuery对象中.为此使用闭包.

First off, you should avoid putting things into the jQuery object. Use closures for that.

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

Second: You should use HTML data-... attributes and jQuery data() to attach custom properties to HTML elements. Avoid using non-standard properties.

第三:您可以可以为事件处理程序使用单独的命名函数定义，但是当您实际上将这些函数用于代码中的不同元素时，这才是最有意义的(您似乎并没有这样做)那).例如，使用直接传递给.click()的匿名函数可产生更易于理解的代码.

Third: You can use separate named function definitions for event handlers, but it makes most sense when you actually re-use those functions for different elements across your code (you don't seem to do that). Using anonymous functions that you pass directly to .click(), for example, results in more understandable code.

// 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 () { ... });块来分隔应该分开的东西.

Use multiple $(function () { ... }); blocks to separate things that should be separate.

不要忘记对您声明的每个变量始终使用var.不使用var声明的变量将是全局变量-并且您不希望使用全局变量.

Don't forget to always use var for every variable you declare. Variables declared without var will be global - and you don't want global variables.

这篇关于如何将命名空间变量传递给click函数参数变量? jQuery的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！