Question

我目前正试图在网页浏览中呈现乐谱HTML（我用javascript库生成）。这是我的代码：

ViewController.swift（partial）：

let web = WKWebView()
let localfilePath = NSBundle.mainBundle().URLForResource("index", withExtension: "html")
let myRequest = NSURLRequest(URL: localfilePath!)
web.loadRequest(myRequest)

的index.html：

<html>
<script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="http://www.vexflow.com/support/vexflow-min.js"></script>
<script src="http://www.vexflow.com/support/tabdiv-debug.js"></script>
<body>
    <h1 id="someElement"> Test </h1>
    <div style="width:680; margin-left: auto; margin-right: auto;">
        <div class="vex-tabdiv">
            options width= 700 space=20
            tabstave notation=true key=A time=4/4
            notes :q =|: (5/2.5/3.7/4) :8 7-5h6/3 ^3^ 5h6-7/5 ^3^ :q 7V/4 |
            notes :8 t12p7/4 s5s3/4 :8 3s:16:5-7/5 :h p5/4
            text :w, |#segno, ,|, :hd, , #tr
        </div>
    </div>
</body>
</html>

虽然HTML确实加载了，但它没有正确呈现。如果我在Chrome中呈现此HTML，它将如下所示：

jsfiddle

然而，当我尝试在我的webview中运行它时，我得到：

正如您所看到的，HTML是在没有JS的情况下呈现的。我已经通过Google / SO挖掘并尝试了各种方法，例如将JS文件设置为本地并将其导入为

<script src="lodash.js"></script>

以及使用WKWebView的executeJavascript函数无济于事，但我必须遗漏一些东西..非常感谢提前！

Answer 1

原因可能是你的div渲染时正在加载js文件。您可以将外部js文件保存到本地并引用这些本地文件。它对我有用。

Answer 2

我想出了这个问题，它涉及两个主要方面：

将资产文件（js，css等）设为本地。正如Huy所提到的那样，处理CDN存在问题
我的vexflow设置存在问题。该div中的换行符是必需的，否则不会起作用。
确保您使用的是vexflow，导入vexflow-min.js 导入vextab.js

希望这有助于将来的其他人！：）

在WebView中加载HTML（以及Javascript源未正确加载） - Swift

2 个答案: