JavaScript 代码在 WPF WebBrowser 加载的 HTML 页面中不起作用

帕特里克·皮尔泽

不久前,我制作了一个 HTML 文档,其中包含一些输入字段和 JavaScript 代码,它使用输入字段中的值执行计算。因为我使用了一些脚本,所以我不得不在与 HTML 相同的目录中添加一个名为“scripts”的文件夹。当我打开 HTML 并在输入字段中插入值时,计算过程起作用了。

现在我正在尝试使用 WPF WebBrowser 控件在 WPF 项目中加载该 HTML。文件夹“scripts”已添加到项目中,并始终复制到输出目录中。在我的代码中,我尝试将 HTML 加载为字符串和 HTML 本身。但无论我做什么 - 当我在输入字段中插入值时,什么也没有发生。

我忘记了某些东西还是在 WPF WebBrowser 中不起作用?

提前致谢!

顺便说一下,这是我的 WPF 的代码:

using System;
using System.Reflection;
using System.Text;
using System.Windows;
using System.Windows.Controls;

namespace WPFWebBrowserControl
{
    /// <summary>
    /// Interaktionslogik für MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            wbcWebBrowser.Navigate(new Uri("https://www.google.de/"));
        }

        private void wbcWebBrowser_Loaded(object sender, RoutedEventArgs e)
        {
            HideScriptErrors(wbcWebBrowser, true);
        }

        private void HideScriptErrors(WebBrowser wb, bool Hide)
        {
            FieldInfo fiComWebBrowser = typeof(WebBrowser).GetField("_axIWebBrowser2", BindingFlags.Instance | BindingFlags.NonPublic);
            if (fiComWebBrowser == null) return;
            object objComWebBrowser = fiComWebBrowser.GetValue(wb);
            if (objComWebBrowser == null) return;
            objComWebBrowser.GetType().InvokeMember("Silent", BindingFlags.SetProperty, null, objComWebBrowser, new object[] { Hide });
        }

        private void NavigateToUrl(object sender, RoutedEventArgs e)
        {
            // Trying to load the HTML CalculationTest
            string curDir = System.IO.Directory.GetCurrentDirectory();
            wbcWebBrowser.Navigate(new Uri(String.Format("file:///{0}/CalculationTest.html", curDir)));
        }

        private void LoadHtml(object sender, RoutedEventArgs e)
        {
            StringBuilder htmlBuilder = new StringBuilder();

            // Trying to load the content of HTML CalculationTest as string
            htmlBuilder.Append("<form style=\"position: relative; height: 100 %; width: 100 %; overflow - x:scroll; overflow - y:scroll; \">");
            htmlBuilder.Append("<div id=\"pagecontent\">");
            htmlBuilder.Append("<input id=\"Wert1\" type=\"text\" maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"position:absolute; top:20px; left:10px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" />");
            htmlBuilder.Append("<input id=\"Wert2\" type=\"text\" maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"position:absolute; top:70px; left:10px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" />");
            htmlBuilder.Append("<input id=\"Wert3\" type=\"text\" disabled maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"position:absolute; top:50px; left:150px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" />");
            htmlBuilder.Append("<script src=\"scripts/ValidationFunctions.js\"/>");
            htmlBuilder.Append("<script src=\"scripts/jquery-2.2.4.min.js\"/>");
            htmlBuilder.Append("<script type=\"text/javascript\">");
            htmlBuilder.Append("$(\"#pagecontent\").keyup(function () {");
            htmlBuilder.Append("CalculationTest();");
            htmlBuilder.Append("});");
            htmlBuilder.Append("$(\"#pagecontent\").change(function () {");
            htmlBuilder.Append("CalculationTest();");
            htmlBuilder.Append("});");
            htmlBuilder.Append("function CalculationTest() {");
            htmlBuilder.Append("var value_Z = parseFloat(ValidateNumberValue(document.getElementById(\"Wert1\").value.replace(\",\", \".\")));");
            htmlBuilder.Append("var value_RBMAX = parseFloat(ValidateNumberValue(document.getElementById(\"Wert2\").value.replace(\",\", \".\")));");
            htmlBuilder.Append("if (value_Z != 0 && value_RBMAX != 0) {");
            htmlBuilder.Append("document.getElementById(\"Wert3\").value = (value_Z*100/value_RBMAX).toFixed(2);");
            htmlBuilder.Append("} else {");
            htmlBuilder.Append("document.getElementById(\"Wert3\").value = null;");
            htmlBuilder.Append("}");
            htmlBuilder.Append("}");
            htmlBuilder.Append("</script>");
            htmlBuilder.Append("</div>");
            htmlBuilder.Append("</form>");

            string html = htmlBuilder.ToString();
            wbcWebBrowser.NavigateToString(html);
        }
    }
}

和 JS 脚本 ValidationFunctions.js:

//Validates the given number value and returns it.
function ValidateNumberValue(value) {
    if (isNaN(value) || value == "") {
        value = 0;
    }
    return value;
}

//Validates the actual input in a field of type number.
function ValidateNumberInput(evt) {
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode(key);
    //***
    //Just total numbers.
    //var regex = /[0-9]|\./;
    //Numbers with decimals.
    //var regex = /[0-9]+([.\,][0-9]+)?/;
    //if (!regex.test(key)) {
    //    theEvent.returnValue = false;
    //    if (theEvent.preventDefault) theEvent.preventDefault();
    //}
    //***
    //var allowedSigns = "1234567890,.-";
    //if (!allowedSigns.includes(key)) {
    //    theEvent.returnValue = false;
    //    if (theEvent.preventDefault) theEvent.preventDefault();
    //}
    //***
    var success = false;
    if (key == "1") { success = true; }
    if (key == "2") { success = true; }
    if (key == "3") { success = true; }
    if (key == "4") { success = true; }
    if (key == "5") { success = true; }
    if (key == "6") { success = true; }
    if (key == "7") { success = true; }
    if (key == "8") { success = true; }
    if (key == "9") { success = true; }
    if (key == "0") { success = true; }
    if (key == ",") { success = true; }
    if (key == ".") { success = true; }
    if (key == "-") { success = true; }
    if (success == false) {
        theEvent.returnValue = false;
        if (theEvent.preventDefault) theEvent.preventDefault();
    }
}

并且 - 最后 - HTML 文档 CalculationTest.html:

<form style="position:relative; height:100%; width:100%; overflow-x:scroll; overflow-y:scroll;"> 
<div id="pagecontent">
<input id="Wert1" type="text" maxlength="7" placeholder="___,__" title="Please use format ###,##" pattern="^[+-]?\d{0,3}((\.|,)\d{1,2})?" style="position:absolute; top:20px; left:10px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;" />
<input id="Wert2" type="text" maxlength="7" placeholder="___,__" title="Please use format ###,##" pattern="^[+-]?\d{0,3}((\.|,)\d{1,2})?" style="position:absolute; top:70px; left:10px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;" />
<input id="Wert3" type="text" disabled maxlength="7" placeholder="___,__" title="Please use format ###,##" pattern="^[+-]?\d{0,3}((\.|,)\d{1,2})?" style="position:absolute; top:50px; left:150px; font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;" />
<script src="scripts/ValidationFunctions.js"></script>
<script src="scripts/jquery-2.2.4.min.js"></script>
<script type="text/javascript">
$("#pagecontent").keyup(function () {
CalculationTest();});
$("#pagecontent").change(function () {
CalculationTest();});
function CalculationTest() { 
var value_Z = parseFloat(ValidateNumberValue(document.getElementById("Wert1").value.replace(",", ".")));
var value_RBMAX = parseFloat(ValidateNumberValue(document.getElementById("Wert2").value.replace(",", ".")));
if (value_Z != 0 && value_RBMAX != 0) {
document.getElementById("Wert3").value = (value_Z*100/value_RBMAX).toFixed(2);
} else {
document.getElementById("Wert3").value = null;
}
}
</script>
</div>
</form>
帕特里克·皮尔泽

我已经找到了解决我的问题的方法。我必须将 HTML 字符串编写为文件并使用 WebBrowser 控件导航到它。

这是我的方法的新代码:

        StringBuilder htmlBuilder = new StringBuilder();

        htmlBuilder.Append("<!--saved from url=(0014)about:internet-->");
        htmlBuilder.Append("<!DOCTYPE html>");
        htmlBuilder.Append("<html lang=\"de\" xmlns=\"http://www.w3.org/1999/xhtml\">");
        htmlBuilder.Append("<head>");
        htmlBuilder.Append("<meta charset=\"utf-8\" content=\"IE=9\" />");
        htmlBuilder.Append("<title></title>");
        htmlBuilder.Append("</head>");
        htmlBuilder.Append("<body>");
        htmlBuilder.Append("<form>");
        htmlBuilder.Append("<div id =\"pagecontent\">");
        htmlBuilder.Append("<label>Wert 1</label><br/>");
        htmlBuilder.Append("<input id =\"Wert1\" type=\"text\" maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" /><br/>");
        htmlBuilder.Append("<label>Wert 2</label><br/>");
        htmlBuilder.Append("<input id =\"Wert2\" type=\"text\" maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" /><br/>");
        htmlBuilder.Append("<label>Ergebnis</label><br/>");
        htmlBuilder.Append("<input id =\"Wert3\" type=\"text\" disabled maxlength=\"7\" placeholder=\"___,__\" title=\"Please use format ###,##\" pattern=\"^[+-]?\\d{0,3}((\\.|,)\\d{1,2})?\" style=\"font-family:Arial; font-style:normal; font-weight:normal; font-size:12px; text-align:left; height:20px; width:120px;\" /><br/>");
        htmlBuilder.Append("<script src =\"scripts/ValidationFunctions.js\"></script>");
        htmlBuilder.Append("<script src =\"scripts/jquery-2.2.4.min.js\"></script>");
        htmlBuilder.Append("<script type =\"text/javascript\">");
        htmlBuilder.Append("$(\"#pagecontent\").keyup(function () {");
        htmlBuilder.Append("CalculationTest();");
        htmlBuilder.Append("});");
        htmlBuilder.Append("$(\"#pagecontent\").change(function () {");
        htmlBuilder.Append("CalculationTest();");
        htmlBuilder.Append("});");
        htmlBuilder.Append("function CalculationTest() {");
        htmlBuilder.Append("var value_Z = parseFloat(ValidateNumberValue(document.getElementById(\"Wert1\").value.replace(\",\", \".\")));");
        htmlBuilder.Append("var value_RBMAX = parseFloat(ValidateNumberValue(document.getElementById(\"Wert2\").value.replace(\",\", \".\")));");
        htmlBuilder.Append("if (value_Z != 0 && value_RBMAX != 0) {");
        htmlBuilder.Append("document.getElementById(\"Wert3\").value = (value_Z*100/value_RBMAX).toFixed(2);");
        htmlBuilder.Append("} else {");
        htmlBuilder.Append("document.getElementById(\"Wert3\").value = null; }}");
        htmlBuilder.Append("</script>");
        htmlBuilder.Append("</div>");
        htmlBuilder.Append("</form>");
        htmlBuilder.Append("</body>");
        htmlBuilder.Append("</html>");

        string html = htmlBuilder.ToString();
        // This doesn't work! JavaScript will not be executed when the page was loaded as a string.
        //wbcWebBrowser.NavigateToString(html);

        // Alternative solution: Writing the page to a file and then navigate to it.
        string curDir = System.IO.Directory.GetCurrentDirectory();
        System.IO.File.WriteAllText(curDir + "\\calctest.html", html, Encoding.UTF8);
        wbcWebBrowser.Navigate(new Uri(String.Format("file:///{0}/calctest.html", curDir)));

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

JavaScript 代码在 WPF WebBrowser 加载的 HTML 页面中不起作用

来自分类Dev

WPF Webbrowser使用JavaScript加载HTML

来自分类Dev

WPF WebBrowser加载JavaScript

来自分类Dev

WPF WebBrowser加载JavaScript

来自分类Dev

如何在 WPF 上的 WebBrowser 中从 javascript 调用客户端代码?

来自分类Dev

Javascript代码在html下拉选项元素中不起作用

来自分类Dev

获取WPF WebBrowser HTML

来自分类Dev

用javascript加载html代码

来自分类Dev

WebBrowser加载页面异常

来自分类Dev

如何在没有安全消息的情况下通过 WPF WebBrowser 加载 HTML

来自分类Dev

在AngularJS中,HTML模板中包含的所有内联javascript代码均不起作用

来自分类Dev

Android-Webview HTML代码提取不起作用(Javascript)

来自分类Dev

HTML5表单验证的Javascript代码不起作用

来自分类Dev

HTML5表单验证的Javascript代码不起作用

来自分类Dev

WPF Webbrowser Control 添加了 JavaScript 代码,不支持 Object.freeze 功能

来自分类Dev

Javascript代码在Firefox中不起作用

来自分类Dev

php代码在javascript中不起作用

来自分类Dev

Ajax代码在JavaScript中不起作用

来自分类Dev

Javascript / jQuery元素在页面重新加载之前不起作用

来自分类Dev

Javascript / jQuery元素在重新加载页面之前不起作用

来自分类Dev

HTML加载不起作用

来自分类Dev

jQuery; 代码在 HTML 页面中不起作用但在控制台中工作

来自分类Dev

在WPF WebBrowser中托管的Web画布上,左键单击不起作用

来自分类Dev

WebBrowser快捷方式在Outlook加载项中不起作用。WebBrowserShortcutsEnabled为true

来自分类Dev

如何将内联样式注入正在WPF WebBrowser中加载的文档中?

来自分类Dev

如何将内联样式注入正在WPF WebBrowser中加载的文档中?

来自分类Dev

在WPF WebBrowser中显示PDF

来自分类Dev

为什么将page2中的HTML的JavaScript加载到page1中不起作用?

来自分类Dev

代码不起作用(JavaScript)

Related 相关文章

  1. 1

    JavaScript 代码在 WPF WebBrowser 加载的 HTML 页面中不起作用

  2. 2

    WPF Webbrowser使用JavaScript加载HTML

  3. 3

    WPF WebBrowser加载JavaScript

  4. 4

    WPF WebBrowser加载JavaScript

  5. 5

    如何在 WPF 上的 WebBrowser 中从 javascript 调用客户端代码?

  6. 6

    Javascript代码在html下拉选项元素中不起作用

  7. 7

    获取WPF WebBrowser HTML

  8. 8

    用javascript加载html代码

  9. 9

    WebBrowser加载页面异常

  10. 10

    如何在没有安全消息的情况下通过 WPF WebBrowser 加载 HTML

  11. 11

    在AngularJS中,HTML模板中包含的所有内联javascript代码均不起作用

  12. 12

    Android-Webview HTML代码提取不起作用(Javascript)

  13. 13

    HTML5表单验证的Javascript代码不起作用

  14. 14

    HTML5表单验证的Javascript代码不起作用

  15. 15

    WPF Webbrowser Control 添加了 JavaScript 代码,不支持 Object.freeze 功能

  16. 16

    Javascript代码在Firefox中不起作用

  17. 17

    php代码在javascript中不起作用

  18. 18

    Ajax代码在JavaScript中不起作用

  19. 19

    Javascript / jQuery元素在页面重新加载之前不起作用

  20. 20

    Javascript / jQuery元素在重新加载页面之前不起作用

  21. 21

    HTML加载不起作用

  22. 22

    jQuery; 代码在 HTML 页面中不起作用但在控制台中工作

  23. 23

    在WPF WebBrowser中托管的Web画布上,左键单击不起作用

  24. 24

    WebBrowser快捷方式在Outlook加载项中不起作用。WebBrowserShortcutsEnabled为true

  25. 25

    如何将内联样式注入正在WPF WebBrowser中加载的文档中?

  26. 26

    如何将内联样式注入正在WPF WebBrowser中加载的文档中?

  27. 27

    在WPF WebBrowser中显示PDF

  28. 28

    为什么将page2中的HTML的JavaScript加载到page1中不起作用?

  29. 29

    代码不起作用(JavaScript)

热门标签

归档