javascript - coffeescript jQuery-如何重构这种(新手)方法？

开始学习一些编码后，我在rails4应用程序中使用了引导程序来执行此（非常丑陋，非DRY）星级评级开关。我已经做过codechoool coffeescript教程，但是对我来说，红宝石似乎更容易学习。

如果有人对“专业人士”如何编写此功能的提示有所帮助？
非常感谢。

@starSwitch =  ->
    label_1 = $("label#1")
    label_2 = $("label#2")
    label_3 = $("label#3")
    label_4 = $("label#4")
    label_5 = $("label#5")

    label_1.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_3.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_2.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_3.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_4.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_5.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_5.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")

$ -> starSwitch

最佳答案

您可以执行以下操作：

@starSwitch =  ->
  $("label").click ->
    $("label").addClass("icon-star colorfull").removeClass("icon-star-empty")
    $(this).nextAll("label").addClass("icon-star-empty").removeClass("icon-star colorfull")

如果页面上还有其他标签，则将一个类添加到星形标签（例如stars），然后将代码更改为$("label.stars").click和nextAll("label.stars")。

关于javascript - coffeescript jQuery-如何重构这种(新手)方法？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/16605302/