使用 jQuery 和 transcrypt 检索文件答案

【问题标题】：Retrieve files with jQuery and transcrypt使用 jQuery 和 transcrypt 检索文件
【发布时间】：2018-02-18 03:07:54
【问题描述】：

我在让 jQuery 与 transcrypt 一起工作时遇到问题。这是我的代码。我想检索一个带负载的文件并将其放入一个变量中。函数 read_file 工作正常，并在 div 元素中显示 var。但是其他两个函数没有按预期工作：read_hidden_var 仅在第二次单击后才起作用，而 read_file_var 根本不起作用，产生错误提示：TypeError $.py_get is not a function。

代码如下：

#!/usr/bin/env python
# -*- coding: utf-8 -*-

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

class TestSystem:

    def read_file(self):
        S("#demo").load("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md")

    def read_hidden_var(self):
        document.getElementById('hidden_text').style.display='block'
        S("#hidden_text").load("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md")
        console.log(S("#hidden_text").html())
        self.file_content = S("#hidden_text").html()
        S("#hidden_text").html("")
        document.getElementById('hidden_text').style.display='none'
        alert(self.file_content)

    def read_file_var(self):
        S.get("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md", self.get_filecontent)

    def get_filecontent(self, response):
        self.file_content = response
        alert(self.file_content)

testSystem = TestSystem()

和html：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="__javascript__/read_file2.js"; charset="UTF-8"></script>
    <title>Read File</title>
  </head>
  <body>
    <main>
        <h1>Read a file!</h1>
        <p id="p1" class="para1">Read a file!</p>
      <button id="button1" onclick="$(document).ready(read_file2.testSystem.read_file)">Click for retrieving text file</button><br><br>
      <button id="button1" onclick="$(document).ready(read_file2.testSystem.read_file_var)">Click for retrieving text file into var</button><br><br>
      <button id="button1" onclick="$(document).ready(read_file2.testSystem.read_hidden_var)">Click for retrieving text file into hidden paragraph</button><br><br>
      <p id="demo"></p>
      <p id="hidden_text"></p>
    </main>
  </body>
</html>

【问题讨论】：

标签： jquery file transcrypt

【解决方案1】：

“py_get 不是函数”报告是由别名引起的。 get 这个词在 Python 中具有特殊含义，因此默认情况下它的别名为 py_get，在这种情况下不存在。您可以取消别名 get 或使用 js_get，因为它别名为 get。所有别名都有类似的选项，可以在以下预定义别名列表中看到：

http://www.transcrypt.org/docs/html/special_facilities.html#pragma-alias

在下面的修改代码中，我使用了js_get，因为它的影响最小。（要查找修改，请搜索!!!）

双击问题更难解决。 我已经用纯 JavaScript 替换了其中涉及的代码，问题仍然存在。 所以我强烈怀疑（但不是 100% 肯定）这不是专门与 Transcrypt 相关的，而是与底层相关的程序逻辑。但我目前无法确定。

#!/usr/bin/env python
# -*- coding: utf-8 -*-

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

class TestSystem:

    def read_file(self):
        S("#demo").load("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md")

    def read_hidden_var(self):
        # !!! Literally inserted JavaScript does not solve the second problem,
        # so probably this isn't specific to Transcrypt
        __pragma__ ('js', '{}', '''
            console.log ("BEGIN read_hidden_var");
            document.getElementById("hidden_text").style.display="block";
            $("#hidden_text").load("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md");
            console.log($("#hidden_text").html());
            self.file_content = $("#hidden_text").html();
            $("#hidden_text").html("");
            document.getElementById("hidden_text").style.display="none";
            alert(self.file_content);
            console.log ("END read_hidden_var");
        ''')

    def read_file_var(self):
        # !!! Using js_get solves the first problem
        S.js_get("https://raw.githubusercontent.com/bunkahle/Transcrypt-Examples/master/README.md", self.get_filecontent)

    def get_filecontent(self, response):
        self.file_content = response
        alert(self.file_content)

testSystem = TestSystem()

【讨论】：