0

在开始学习一些编码之后，我在 rails4 应用程序中使用引导程序进行了这个（非常丑陋，非 DRY）星级开关。我已经完成了代码学校的咖啡脚本教程，但似乎 ruby​​ 对我来说更容易学习。

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

@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
4

1 回答 1

3

您可以执行以下操作：

@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")。

于 2013-05-17T09:15:39.050 回答