如何从流星模板事件中的 html 标签中获取文本?

Posted

技术标签:

【中文标题】如何从流星模板事件中的 html 标签中获取文本?【英文标题】:How can fetch the text from html tag in meteor template event? 【发布时间】:2015-07-05 12:37:54 【问题描述】:

如何从下面的代码中获取“选项 1”:

<template name="MyTemplate">
   <div class="dropdown">
      <a class="dropdown-toggle count-info" data-toggle="dropdown" href="#" aria-expanded="false">
         <button type="button" class="btn btn-sm btn-primary">Add</button>
      </a>
      <div class="dropdown-menu dropdown-alerts">
         <form method="post" id="some-form" data-remote="true" accept-charset="UTF-8">
            <div class="form-group">
               <label>Select Option</label>
               <div class="input-group">
                  <select class="chosen-select" tabindex="2">
                     <option value="op1">Option 1</option>
                     <option value="op2">Option 2</option>
                     <option value="op3">Option 3</option>
                  </select>
               </div>
            </div>
            <input type="submit" value="Add" data-disable-with="Saving..." class="btn btn-sm btn-success">
         </form>
      </div>
   </div>
</template>

我正在使用选择的插件 (http://harvesthq.github.io/chosen/) 作为样式。所以,下拉节点转换不同,有一个节点是这样的:

<a class="chosen-single" tabindex="-1">
    <span>Option 1</span>
</a>

其中包含从下拉列表中选择的值。

在模板事件中我的代码是:

template.find("#some-form .chosen-single span");

它给了我:

<span>Option 1</span>

我想从中获得“选项 1”。如果我这样写:

// giving "undefined"
template.find("#some-form .chosen-single span").html; 
or
// giving error :: Uncaught TypeError: undefined is not a function
template.find("#some-form .chosen-single span").html();

【问题讨论】:

template.find("#some-form .div-class span").html(); 应该可以工作。你能在某个地方重现这个问题吗? 你的模板有问题,你能告诉我们包含你的模板的代码吗? 或尝试.text() 而不是.html() 你的跨度在哪里?还是你好?? 感谢@ofcapl 它有效...感谢大家的帮助... 【参考方案1】:
template.find("#some-form .chosen-single span").text();

【讨论】:

【参考方案2】:

不确定此文档中解释的所有其他信息: http://meteor.github.io/blaze/docs.html#eventmaps

但对我来说,这段代码有效(流星 1.1.0.3) html:

<template name="newTextLabel">
      <span class="label label-primary pull-right genre">this</span>
</template>

事件:

Template.newTextLabel.events (
    'click .genre': function(event) 
     sAlert.info('test: ' + event.target.textContent);
    //  Router.go('somePath', 
    //   _id: this.genrePath
    //  );

   
)

【讨论】:

以上是关于如何从流星模板事件中的 html 标签中获取文本?的主要内容,如果未能解决你的问题,请参考以下文章

流星 - 如何编写引导模式模板以重新呈现 html 输入值,即使用户已输入它们

从 html 文档中的合格 span 标签获取类值和文本

使用流星模板助手获取 DOM 元素

如何将下拉值传递给模板助手。 [流星+火焰]

本地数组更改时如何重新渲染流星火焰模板?

从 html 输入文本和标签获取 JSON 对象中的值