javascript - 试图单独读取div标签在 meteor JS模板中都共享相同的类

使用{{for each}}把手遍历Meteor JS中的MongoDB Collection。数据在按钮内部显示良好。

问题是如何读取与btn-correctOption类的按钮关联的文本。
由于#each，我有多个与btn-correctOption类关联的按钮。


quizDisplaySection.js文件

quizDisplaySection模板

<template name="quizDisplaySection">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <ul>{{#each questions}}
                    <br>{{> question}}
                    <br>{{/each}}</ul>
            </div>
        </div>
    </div>
</template>

问题模板文件

<template name="question">
    <div class="row">
        <div class="col-md-12">
            <button type="button" class="btn btn-info btn-block btn-quiz" disabled>{{Quiz}}</button>
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-danger btn-block btn-option">{{Option1}}</button>
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-danger btn-block btn-option">{{Option2}}</button>
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-danger btn-block btn-option">{{Option3}}</button>
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-danger btn-block btn-option">{{Option4}}</button>
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-danger btn-block btn-correctOption hide">{{OptionCorrect}}</button>
        </div>
        <div class="col-md-12">
            <hr width="75%">
        </div>
    </div>
</template>

我正在尝试读取btn-correctOption类的按钮的值，但是由于#each模板渲染，我的btn-correctOption类具有多个按钮。


3.quizDisplaySection.js

"click .btn-option": function(evt,tmp){
    var qds_correctOption = $(".btn-correctOption").text();
    alert(qds_correctOption);
}

qds_correctOption给我字符串，其中是按钮中所有文本与btn-correctOption类的组合值。解决此问题的任何方法

最佳答案

尝试使用template.$(selector)：


  在此模板实例中找到所有与选择器匹配的元素，
  和
  将它们作为JQuery对象返回。

Template.question.events({
  'click .btn-option': function(evt, tmp) {
    var current_option = $(evt.currentTarget).text();
    var qds_correctOption = tmp.$(".btn-correctOption").text();
    console.log(current_option, qds_correctOption);
  }
});