1

我想将此示例 html 文档翻译为 Transcrypt：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p").click(function(){
        $(this).hide();
    });
});
</script>
</head>
<body>

<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>

</body>
</html>

我的代码导致 hide.py：

__pragma__ ('alias', 'S', '$')

def hide():
    S("p").click(S(this).hide())

S(document).ready(hide)

运行 hide.html 时：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<script src="__javascript__/hide.js" charset="UTF-8"></script> 
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
</body>
</html>

我收到错误 TypeError: (intermediate value).apply is not a function in the console window。

4

1 回答 1

0

在以下行中：

S("p").click(S(this).hide())

你调用 hide，而不是传递 hide 回调的地址。这与您在此处遇到的问题相同：

Transcrypt 和 FileReader

如果我纠正它，我会得到：

__pragma__('alias', 'S', '$')

def hide():
   S("p").click(S(this).hide)

S(document).ready(hide)

它报告了几个无效的关键帧。

如果我直接在 JavaScript 中做同样的事情（所以没有 Transcrypt）：

function hide () {
   $("p").click($(this).hide);
}

$(document).ready(hide)

我得到完全相同的错误。

我查了一下这里的 JS 代码应该是什么：

https://www.w3schools.com/jquery/jquery_hide_show.asp

即：

function hide () {
    $("p").click(function () {$(this).hide ()});
}

$(document).ready(hide)

这确实是您原始 HTML 内联脚本中的内容。在 Transcrypt 中，这将是：

__pragma__('alias', 'S', '$')

def hide():
   S("p").click(lambda: S(this).hide ())

S(document).ready(hide)

我都测试过，JavaScript 和 Transcrypt 版本都可以正常工作。

如果我查看 Transcrypt 生成的代码，那就不足为奇了：

    var hide = function () {
        $ ('p').click ((function __lambda__ () {
            return $ (this).hide ();
        }));
    };
    $ (document).ready (hide);

Transcrypt 生成的代码类似于手动编写的 JavaScript，就像两滴水一样。

不要对这里使用的是hide ()（带大括号）而不是hide（不带大括号）的事实感到困惑。此处的回调是匿名 cq lambda 函数，而不是hide函数。并且匿名 cq lambda 函数在传递给click (). 换句话说，它们没有尾括号。

故意犯同样的错误：

__pragma__('alias', 'S', '$')

def hide():
   S("p").click((lambda: S(this).hide ())())

S(document).ready(hide)

行不通，也不会：

function hide () {
    $("p").click((function () {$(this).hide ()}) ());
}

$(document).ready(hide)

所以传递回调的区别：

 $("p").click (my_callback)     // Right

并称它为：

 $("p").click (my_callback ())  // Wrong

至关重要。

我希望这能澄清一点。

您可能想知道为什么不能简单地通过$(this).hide，而无需调用它的额外包装函数。

这是因为$(this).hide不会评估为以后可以在调用中使用的固定回调地址。另一方面，封装函数具有固定地址，因此可以用作回调。

这是一个 JQuery 魔术的例子，一方面非常聪明，另一方面表明了一种并不总是存在的简单性。

关于函数命名的提示：你已经命名了你的函数hide，这会加剧调用函数和传递函数地址之间的混淆。你hide没有隐藏任何东西。它只安装一个可以隐藏某些东西的回调。所以这个名字install_hide可能更合适，虽然有点长......

于 2018-03-06T20:31:27.660 回答