微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何告诉Javascript方法等待绑定值在DotVVM中执行?

如何解决如何告诉Javascript方法等待绑定值在DotVVM中执行?

我使用值绑定(<dot:HtmlLiteral Html="{value: BannerHTML}" class="mainBanner"/>)来基于多个变量生成我的某些页面内容

我还需要在生成的HTML上运行一些javascript,以修复一些小问题,例如匹配字体大小以适应异常缩放情况等。按照标准,我将可执行JavaScript放在HTML文档的 end 处。

在以下情况之一中生成的HTML:

<div class="mainBanner" data-bind="html: BannerHTML">
    <div class="mainBanner-upper">some text</div>
    <div class="mainBanner-face" id="mainTitle">some other text</div>
    <div class="mainBanner-lower">some more text</div>
</div>

用于对该HTML进行操作的JS:
(需要https://github.com/adactio/FitText.js

window.fitText(document.getElementById("mainTitle"));

据我所知,javascript在生成HTML之前执行,并且在元素上执行的javascript返回Cannot read property 'xyz' of null。我如何告诉它等待?我既尝试将javascript文件绑定到资源,又简单地在body元素的末尾使用<script>标签将其写入,但没有成功。

解决方法

由于您的问题似乎与DOM有关,因此我可以向您提出两个解决方案。

  1. 您的JavaScript必须检查并等待DOM。我强烈建议您阅读answer...how to call a function when the page/DOM is ready...

  2. 绑定数据后动态添加脚本(对此我不太确定)

祝你好运。

编辑

因此,我去看了一下dotvvm文档以查找事件调用,并发现了一些有趣的东西:

每个DotVVM页面都包含Dotvvm.js,它在全局范围内定义了dotvvm。该对象可用于访问视图模型并对各种页面事件做出反应。

这使您可以访问DOTVVM触发的特定事件,而您只需要找到您所需的事件即可。我在下面为您提供了一个示例。

您可以尝试这样的操作(该事件可能不是您需要的):

<script>
    //By subscribing to the event,your code will only be executed 
    // if "init" event is fired by dotvvvm
    dotvvm.events.init.subscribe(()=>{ 
        window.fitText(document.getElementById("mainTitle"));  
        //basically enclose the content of your script tag with this.
    });
</script>

请务必阅读文档,因为我可能省略了一些内容? DOTVVM Javascript Events

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?