使用javascript动态更改按钮的文本

时间:2015-10-15 09:30:45

标签: javascript jquery html coffeescript

我有一个包含5个元素的下拉列表,按下时会在按钮内显示。 现在,按钮获取选定选项卡的值,但我希望它在此值之前有一个默认文本;这个文字应该是"过滤:"值。而且我还需要显示插入符号...任何想法如何才能使其正常工作?

HTML:

<div class='filtering_options dropdown'>
  <button class="btn bet-filter btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Filter by:
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu CHECK-HEIGHT" aria-labelledby="dropdownMenu1">
    <li><a href='#brzn/yolo/all' class='btn btn-filter all' data-filter='all'>{{translate 'bets_filter_all'}}</a></li>
    <li><a href='#brzn/yolo/open' class='btn btn-filter open' data-filter='open'>{{translate 'bets_filter_open'}}</a></li>
    <li><a href='#brzn/yolo/closed' class='btn btn-filter closed' data-filter='closed'>{{translate 'bets_filter_closed'}}</a></li>
    <li><a href='#brzn/yolo/pending' class='btn btn-filter pending' data-filter='pending'>{{translate 'bets_filter_ended'}}</a></li>
    <li><a href='#brzn/yolo/resolved' class='btn btn-filter resolved' data-filter='resolved'>{{translate 'bets_filter_resolved'}}</a></li>
  </ul>
</div>

JS与coffeescript:

  filter: (filter)->
    # set default values for the filter
    if _.isEmpty(filter)
      filter = @default_filter
    if filter.dir
      filter.dir = parseInt(filter.dir) || 0
    if !(filter.status in ['all', 'open', 'closed', 'pending', 'resolved'])
      filter.status = 'all'
    prev_filter = @filter_options
    @filter_options = _.extend({}, @default_filter, filter)
    if _.isEqual(@filter_options, prev_filter)
      return
    @update_comments(@filter_options)
    @$('.btn-filter.active').not(".btn-filter.#{filter.status}").removeClass('active')
    @$(".btn-filter.#{filter.status}").addClass('active')
    @$(".bet-filter").text(filter.status)

1 个答案:

答案 0 :(得分:0)

自己找到解决方案:

  1. 为“过滤依据”
  2. 创建了新的翻译
  3. 将此翻译与值
  4. 连接

    @$(".bet-filter").text((@app.translate('filter_by')) + (filter.status))