0

在我的应用程序中,我有一些看起来像这样的标签

x Beer x Wine x Gummy Bears

如果您单击“x”,则应该删除该标签。

标签的创建如下所示,“x”周围有一个链接。<%= %> 内的代码是 ruby​​。例如,参数化方法将使 Gummy Bears 标记类似于“Gummy-bears”。

<a href="#" class="link tag" data-span="<%= tag.name.parameterize %>"data-question="<%= @question.id %>" data-tag="<%= tag.name%>" >x</a>

<span class="<%=  tag.name.parameterize %>"><%= tag.name %></span>

我在“x”链接上设置了 JavaScript 点击事件。我可以在单击后立即删除“x”,但在页面刷新之前我无法删除实际的标签名称,这不是我想要的。为了立即删除 tag.name,我围绕标签名称创建了一个跨度类,该类与“x”链接上的 html 数据属性之一相同。我将数据属性保存到变量(this.span)

   this.spanVariable = $(r.target).attr("data-span");  #gets the tag.name parameterize from the data-span

例如,如果点击的是 Gummy Bear 标签,this.spanVariable 现在将是“Gummy-Bear”。

然后我想清空'Gummy-Bear'类的html,所以我想做这样的事情来评估javascript变量,使它成为类。我以为我可以在 #{} 中评估 javascript 但我猜不是:(

   $('.#{this.spanVariable}').html('');

有没有办法完成我想要做的事情,基本上使变量评估,这样它就可以成为也是一个 jquery 对象的类(即我可以调用 jquery 方法)。

4

2 回答 2

1

您是否正在混合服务器和客户端?尝试

$('.'+this.spanVariable).empty();
于 2013-03-27T06:37:02.563 回答
1

尝试这个:

$('.' + this.spanVariable).remove();

这种方式应该避免竞争条件,调用一些ajax,并在它返回时做一些事情:

$('.xclass').click(function(e) {
  var spanVariable = $(this).data("span");
  $.ajax("/my/server/endpoint?tag=" + spanVariable, {
    dataType: 'json',
    success: function(result) {
      $('.' + result.spanVariable).remove();
      $('.tag[data-span=' + result.spanVariable + ']').remove();
    },
    error: function() {
      console.log('Couldn't remove the tag...');
    }
  }
});
于 2013-03-27T06:37:48.613 回答