Question

我是coffeescript的新手，虽然有关coffeescript中编码香草javascript的正确方法的广泛信息，但关于如何在coffeescript中编写jQuery的信息很少。

如果有人可以解释如何在这个jQuery悬停事件中编写逗号分隔函数，就像咖啡脚本一样，我们将不胜感激。

$(".sprite-image.btn-rest").hover(
    function () {
        $(this).removeClass('btn-rest').addClass('btn-hover');
    },
    function () {
        $(this).removeClass('btn-hover').addClass('btn-rest');
        $(this).parent().prev().children('.sprite-image.btn-rest_before_activecurrent').removeClass('btn-rest_before_activecurrent').addClass('btn-rest');
        $(this).parent().prev('.sprite-image.nav_spacer_1-activecurrent').removeClass('nav_spacer_1-activecurrent').addClass('nav_spacer_1-rest');
    }
);

为了回应Larry Battle在下面发布的正确答案，我发布了我对Larry的原始coffeescript 所做的更正，然后进行了更正。

$('.sprite-image.btn-rest').hover ->
    $(this).removeClass('btn-rest').addClass 'btn-hover'
, ->
    $(this).removeClass('btn-hover').addClass 'btn-rest'
    $(this).parent().prev().children('.sprite-image.btn-rest_before_activecurrent').removeClass('btn-rest_before_activecurrent').addClass 'btn-rest'
    $(this).parent().prev('.sprite-image.nav_spacer_1-activecurrent').removeClass('nav_spacer_1-activecurrent').addClass 'nav_spacer_1-rest'

我很好奇，因为这个咖啡因产生了与他更正的答案相同的结果。我的问题：一个比另一个好吗？

Answer 1

我只想用js2coffee.org查看你的javascript代码在coffeescript中的样子。

js2coffee.org将您的代码翻译成以下内容。

$(".sprite-image.btn-rest").hover (->
  $(this).removeClass("btn-rest").addClass "btn-hover"
), ->
  $(this).removeClass("btn-hover").addClass "btn-rest"
  $(this).parent().prev().children(".sprite-image.btn-rest_before_activecurrent").removeClass("btn-rest_before_activecurrent").addClass "btn-rest"
  $(this).parent().prev(".sprite-image.nav_spacer_1-activecurrent").removeClass("nav_spacer_1-activecurrent").addClass "nav_spacer_1-rest"

<强>更新

js2coffee.org输出了错误的代码。这是正确的翻译。

$(".sprite-image.btn-rest").hover(
    ->
        $(this).removeClass("btn-rest").addClass "btn-hover"
    ,->
        $(this).removeClass("btn-hover").addClass "btn-rest"
        $(this).parent().prev().children(".sprite-image.btn-rest_before_activecurrent").removeClass("btn-rest_before_activecurrent").addClass "btn-rest"
        $(this).parent().prev(".sprite-image.nav_spacer_1-activecurrent").removeClass("nav_spacer_1-activecurrent").addClass "nav_spacer_1-rest"
)

如何将jQuery事件中的逗号分隔函数编码到CoffeeScript中

1 个答案: