javascript - 如何处理 meteor 中的按钮点击事件？

Question

我有一个 meteor 模板:

<template name="createDefaultTemplate">

    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title"> Select Role of router</h4>
        </div>

        <div class="btn-group btn-group-justified" id="routerType">
            <a href="{{pathFor route="edgeRouterAvailablePGTemplate"}}" id= "edge" class="btn btn-default">Edge Router</a>
            <a href="{{pathFor route="aggrRouterAvailablePGTemplate"}}" id= "agg" class="btn btn-default">Aggr. Router</a>
            <a href="{{pathFor route="coreRouterAvailablePGTemplate"}}" id= "core" class="btn btn-default">Core Router</a>
        </div>
    </div>

我正在尝试提取所单击按钮的值，以便我可以触发新路线。不幸的是，我无法做到正确。我已经尝试过以下操作，但它确实从按钮中获取了值。

Template.createDefaultTemplate.events({
    'click #agg ': function(event){
        console.log(event);
        var selectValue = $(event.target).val();
        console.log(selectValue + "is selected  - message logged in events");
        Session.set("selectedSchema",selectValue);
        console.log(Session.get("selectedSchema")+ " is session variable set - message logged in events");
    }
});

我也尝试过类似的方法:

 'click' : function(event)
'click a .btn .btn-default' : function(event)

但它们似乎都没有任何效果。我能够读取 console.log(event)，但单击后无法提取值。

如何解决这个问题？

Answer 1

如果我很清楚你的问题。您需要为每个按钮附加一个值。您可以通过使用 html 元素的 data 属性来实现

 <div class="btn-group btn-group-justified" id="routerType">
        <a href="{{pathFor route="edgeRouterAvailablePGTemplate"}}" id= "edge" data-value="6" class="btn btn-default">Edge Router</a>
        <a href="{{pathFor route="aggrRouterAvailablePGTemplate"}}" id= "agg" data-value="65" class="btn btn-default">Aggr. Router</a>
        <a href="{{pathFor route="coreRouterAvailablePGTemplate"}}" id= "core" class="btn btn-default">Core Router</a>
    </div>

要取回模板按钮单击事件的值，您可以简单地执行此操作。

    var selectValue = $(event.target).data('value')