javascript - 当值为零时禁用 cilck 事件，然后在悬停时显示通知弹出窗口

Question

请帮我解决我的问题。请耐心等待，我是使用 HAML 的 Ruby on Rails 的新手。

我有一个显示卡数的选项卡。 见下文..

有些标签没有计数，因为我没有在该表下添加任何内容。如果值为零，我想禁用并且不显示计数，并在悬停时显示注释。卡在这个上面很久了。你能帮助我或给我一个关于我应该如何去做的提示吗？我应该做一个帮手吗？或在选项卡代码黑色开始之前添加条件语句？如果您有自己的解决方案，请随时回答，将不胜感激。

这是我上面照片的代码。

    -tab_classes = "px-2 cursor-pointer border-transparent text-gray-600 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-bold text-base"
    
  
    %a{class: tab_classes, data: {main_feed_target: "blockTypeTab", id: "all", action: "click->main-feed#blockTypeChange"}}
      = E('all_cards_bar')
      = "(#{@blocks.length})"
    %a{class: tab_classes, data: {main_feed_target: "blockTypeTab", id: "pods", action: "click->main-feed#blockTypeChange"}}
      = E('pods_cards_bar')
      = "(#{@blocks.pods.length})"          
    %a{class: tab_classes, data: {main_feed_target: "blockTypeTab", id: "tweets", action: "click->main-feed#blockTypeChange"}}
      = E('tweets_cards_bar')
      = "(#{@blocks.tweets.length})"
    %a{class: tab_classes, data: {main_feed_target: "blockTypeTab", id: "vids", action: "click->main-feed#blockTypeChange"}}
      = E('vids_cards_bar')
      = "(#{@blocks.vids.length})"
    %a{class: tab_classes, data: {main_feed_target: "blockTypeTab", id: "blogs", action: "click->main-feed#blockTypeChange"}}
      = E('blogs_cards_bar')
      = "(#{@blocks.blogs.length})"

我正在为 CSS 使用 HAML 和 Tailwind 类。

谢谢！！

标签： javascriptjqueryruby-on-railshamltailwind-css