如何让 markdown.js 在 Delphi 的 TWebBrowser 中将 Markdown 文档显示为 HTML?

2024-04-05

如何让 markdown.js 在 Delphi 的 TWebBrowser 中将 Markdown 文档显示为 HTML?

给定包含 Markdown 的字符串的内容,如何让 markdown.js 将该 markdown 转换为 HTML,并在 TWebBrowser 组件中显示该 HTML,所有这些都在我的 Delphi 桌面应用程序中?

UPDATE:

按照 Wouter 的例子(谢谢你,Wouter!),如果我简单地这样做:

procedure TForm2.Button1Click(Sender: TObject);
begin
  WebBrowser1.Navigate('file://C:/junk/markdown/lib/markdown.js');
end;

然后我收到一系列警告。首先,Windows“保护”我免受 JavaScript 的影响。我批准并运行一切,但最后我得到:


好的,这有效:

HTML:

<!DOCTYPE html>
<html>
    <head><style>body{font-family:Arial;font-size:small}</style></head>
<body>  
    <div id="markdown"></div>
    <input type="hidden" id="hidden" /> 
    <script type="text/javascript">
        hiddenEl=document.getElementById('hidden');
        markdownEl=document.getElementById('markdown');
    </script>
    <script src="lib/markdown.js"></script>
</body>
</html>

德尔福代码:

procedure TForm38.Memo1Change(Sender: TObject);
begin
  WebBrowser1.OleObject.Document.GetElementByID('hidden').setAttribute('value', Memo1.Text);
  WebBrowser1.OleObject.Document.ParentWindow.execScript('markdownEl.innerHTML = markdown.toHTML(hiddenEl.value)');
end;

procedure TForm38.FormCreate(Sender: TObject);
begin
  WebBrowser1.Navigate('file://c:/!/markdown.html');
end;

当然,这只是一个概念证明。 特别是 Delphi 代码应该检查文档是否已加载,但这种类型的代码只会分散此示例的注意力。


也许您想知道为什么我首先将 TMemo 的内容写入隐藏元素? 这是因为当您将 JavaScript 构建为字符串时,将带有换行符的文本传递给 JavaScript 函数非常复杂。你会得到这样的东西:

window.alert("Hello
World");

update在我的示例中,我的子文件夹中有 markdown.jslibhtml 文件的。 确保<script src="lib/markdown.js"></script>真正指向Markdown.js的位置

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何让 markdown.js 在 Delphi 的 TWebBrowser 中将 Markdown 文档显示为 HTML? 的相关文章

随机推荐

  • 多线程编程中什么是公平性?

    什么是线程公平性或并发 多线程编程中的公平性 我用谷歌搜索过 有很多关于多线程的信息 但不完全是关于公平性的 有人可以解释一下吗 非常欢迎举一个例子 公平性基本上类似于不同线程能够advance无论他们在做什么 100 公平意味着 所有线程
  • 应用 API 响应转换的最佳位置 [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 在异步操作创建器中 我从服务器获取数据 对于我的用例来说 数据的格式不太好 我需要对其进行转换以在 UI 中使用它 问题 我应该 在数据到达后立
  • MKOverlayRenderer 在地图视图上显示 UIImage

    我正在尝试在 iOS 7 中的地图视图上显示图像 我将 MKOverlayRenderer 子类化如下 MapOverlayRenderer h import
  • Room 未向表中插入数据

    有趣的是 它有时会正确执行插入操作 我不知道为什么以及如何会发生这种情况 所以 我无法弄清楚我在哪里犯了错误 这是我的项目文件 1 SentFilesDao java Dao public interface SentFilesDao Qu
  • 在 VSCode 中通过缩进更改纯文本颜色

    我有兴趣在 VSCode 中进行讲座并在简单的文本文件中做笔记 因为我已经使用它进行编码 然而 对于我的一生 我无法弄清楚如何更改简单的文本颜色 我想要的是在一种缩进深度处具有一种文本颜色 例如 Notes a b Notes会是不同的颜色
  • 删除字符串中空格的最快方法

    我试图从数据库表中的字符串中获取由 分隔的多个电子邮件地址 但它也返回了空格 我想快速删除空格 以下代码确实删除了空格 但每当我尝试在字符串中获取大量电子邮件地址 例如 30000 然后尝试删除它们之间的空格时 它也会变得很慢 删除这些空格
  • 当 Repeater 的委托高度发生变化时调整 ColumnLayout

    我已经设置了一个名为测试1 qml包含以下内容 import QtQuick 2 6 import QtQuick Layouts 1 3 Rectangle width 800 height 1000 ColumnLayout ancho
  • UIViewController 中的扩展边缘属性是什么?

    我在论坛上读过有关此属性的内容 大多数人将此属性设置为 false 或在情节提要中取消选中它 我自己这样做是因为当我在视图中嵌入 UINavigation 控制器时 顶部栏将我的 UITextView 向下推 以便文本在底部开始编辑 取消选
  • C++:如何解决在未知点引起的首次异常?

    我正在处理的一个 C 项目在抛出第一次机会异常时终止 当我第一次尝试访问调试模式下的 Visual Studio 2008 时 会发生这种情况map
  • ActionBarSherlock 堆叠操作栏样式问题

    我不明白为什么堆叠ActionBar我已经实现了最左边的选项卡和屏幕边缘之间有一个间隙 最右侧选项卡的情况并非如此 我尝试通过设计样式来删除分隔线ActionBar 在尝试了一下样式后 我似乎能够覆盖 TabView 样式的属性 但不能覆盖
  • Android 打印堆栈跟踪

    如何在 android 中获得相当于 printStackTrace 的功能 我知道我可以通过将标签名称和字符串传递给日志记录方法来记录错误 但这只会给我一个空指针异常 如果我调用 e printStackTrace 这些数据会打印到哪里
  • LINQ:通过使不同类型的集合可转换/可比较来使用 .Except() ?

    给定两个不同类型的列表 是否可以使这些类型可以相互转换或相互比较 例如使用 TypeConverter 或类似的 以便 LINQ 查询可以比较它们 我在 SO 上看到过其他类似的问题 但没有任何迹象表明可以使类型之间可以相互转换来解决问题
  • Flutter - 在路由之间推送并获取价值

    如何将绿色字符串从 HomePage 页面发送到 ContaPage 页面 我想是这样的Navigator of context pushNamed conta green 但不知道如何进入页面conta the green string
  • mod_rewrite 到文本/类型/id

    我当前的代码是这样的 store php storeid 12 page 3 我想把它翻译成这样 mysite com roberts clothing store store 12 3 和这样的东西 profile php userid
  • 使用 df 获取可用磁盘空间以仅显示可用空间(以 kb 为单位)?

    我正在尝试输出文件系统上的可用磁盘空间量 example 如果我运行命令df k example我可以获得有关可用磁盘空间 以 kb 为单位 的良好信息 但只有通过人类并实际查看它 我需要获取这些数据并在 shell 脚本中的其他地方使用它
  • Android Studio NDK 链接器错误未定义对“cv::_OutputArray::_OutputArray(cv::Mat&)”的引用

    我正在开发一个使用 NDK 的 Android 项目 其中我使用了 opencv 来进行一些捕获和图像效果的工作 我的 Android mk 如下所示 LOCAL PATH call my dir include CLEAR VARS in
  • 以编程方式显示/隐藏虚拟键盘

    我需要将虚拟键盘保留在屏幕上 即使不使用也是如此 有没有办法强制其可见性 我试着打电话 requestFocus 在文本字段上 但仅当该项目通过鼠标或触摸事件获得焦点时键盘才会抬起 并在失去焦点时消失 我想改变这种默认行为 你应该使用这个
  • Android Studio Bumblebee 无法使用 Safeargs

    我最近将我的 android studio 更新为稳定的 Bumblebee 版本 我想在我的新 android 项目中使用带有安全参数的 Nav 控制器 但是随着 Gradle 插件已更改为 7 1 0 我很困惑在哪里添加安全参数的类路径
  • 如何使用编程代码动态生成 woocommerce 优惠券代码

    我想动态生成 woocommerce 优惠券代码 我的要求是 完成订单后 自动在管理端 woocommerce 优惠券代码列表中为特定产品生成一个优惠券代码 所以任何人知道我的上述需求解决方案 请帮助我 谢谢 克坦 你可以使用woocomm
  • 如何让 markdown.js 在 Delphi 的 TWebBrowser 中将 Markdown 文档显示为 HTML?

    如何让 markdown js 在 Delphi 的 TWebBrowser 中将 Markdown 文档显示为 HTML 给定包含 Markdown 的字符串的内容 如何让 markdown js 将该 markdown 转换为 HTML