Question

这是视图调用的部分：

<li>
  <span class="content"><%= link_to "#{key.name} (#{key.description})", key %> (<%= key.id %>)</span>
  <span class="timestamp">
    Created <%= time_ago_in_words(key.created_at) %> ago.
  </span>
  <span class="content">
  <% if key.chords.count > 0 %>
    <%= link_to "show chords", '#', class: "showremovechords" %>
    <span> // </span>
  <% end %>
      <%= link_to "remove", key, method: :delete %>     
  </span>
  <div class="chordsholder">
    <ol class="chords">
    <% if key.chords.count > 0 %>
      <ol class="microposts">
        <%= render key.chords %>
      </ol>
    <% end %>
    </ol>
    </div>
</li>

这是jQuery（使用CoffeeScript），当点击“show chords”按钮时，切换是否显示div class ='chordsholder'。

jQuery ->
  toggleChords = (e) ->
    e.preventDefault()
    if $(@).text('show chords')
        $(@).text('hide chords')
    else
        $(@).text('show chords')
    $(@).closest('li').find('.chordsholder').slideToggle()

  $('.showremovechords').click toggleChords

div开始隐藏，链接以文本'show chords'开头

div的可见性切换工作，并且文本在第一次单击时更改为“隐藏和弦”，但语句的ELSE部分不起作用，因此文本不会更改回“显示和弦”时div是隐藏的。任何想法为什么会这样？感谢

Answer 1

在您的代码中：

if $(@).text('show chords')

设置值，表达式的返回值始终为 truthy 。所以你的别人永远不会执行jqobject.text(something)是一个二传手。相反，你可能想要比较价值.. 那么这里发生的是，它会将值设置为“show cords”，因为你的if条件中的setter和inturn返回的jquery对象是 truthy 所以它会转到你的if块然后将它设置为“隐藏绳索”。

尝试

if $(@).text() === 'show chords'
        $(@).text('hide chords')
else
    $(@).text('show chords');

您也可以使用文本的fn参数语法（虽然不确定咖啡语法）这样做。

$(@).text(function(_, curValue){
   return curValue === 'show chords' ? 'hide chords' : 'show chords';
})

Coffeescript如果有效，但Else没有

1 个答案: