0

我需要从一键事件中传递数据。我正在构建一个菜单,用于在用户连续单击的链接上提取数据。第一个链接是这样的:

?type=1

然后我需要将其链接到一个链接:

?level=2

使得数据查询为:

?type=1&level=2

问题是代码需要动态确定第二次点击的查询,这可能是也可能不是上面的最后一个查询。直到用户点击才会确定查询,这需要在第二次点击时返回如上所示的查询字符串。

所以我有两个点击处理程序:

btn1.on('click', function() {
  // get value of "type" from query string through some regex.  This works.
}

btn2.on('click', function() {
   // get value of "level" via regex.  This works.
   // get value of type from btn1.click and add to query
   // submit query ?type=___&level=____
}

我该怎么做呢?我尝试使用.bind但无法正常工作。

4

1 回答 1

1

您不能直接在点击事件之间传递数据,至少不会没有很多尴尬。

我的建议是将数据放在点击事件都可以访问的地方,以及有意义的地方。对于您的情况,这可能意味着某些父元素上的数据属性。例如,如果您有两组按钮和一个“查询”提交类型的按钮,它可能看起来像这样:

<ul id="type_menu">
  <li><a href="...">Type 1</a></li>
  <li><a href="...">Type 2</a></li>
  <li><a href="...">Type 3</a></li>
</ul>
<ul id="level_menu">
  <li><a href="...">Level 1</a></li>
  <li><a href="...">Level 2</a></li>
  <li><a href="...">Level 3</a></li>
</ul>
<button id="go">Go!</button>

使用以下脚本:

$(function() {
    $('#type_menu').on('click','li a', function() {
        type = parse_type_from_href($(this));
        $('#type_menu').data('selected_type',type);
    }

    $('#level_menu').on('click','li a', function() {
        level = parse_level_from_href($(this));
        $('#level_menu').data('selected_level',level);
    }

    $('#go').click(function() {
        query='?type=' + $('#type_menu').data('selected_type') + '&level=' + $('#level_menu').data('selected_level');
        //Do what you will with the query here...
    })
}

显然,您必须根据自己的用途对其进行调整,如果您有很多按钮集,则可以更好地抽象此代码,但是从您所说的来看,我认为放置良好的数据属性将是您的最好的选择在这里。

于 2013-07-11T23:12:49.797 回答