23.5.1 WebBrowser与网页交互
版权声明：本文为博主原创文章，转载请在显著位置标明本文出处以及作者网名，未经作者允许不得用于商业目的。
本节虽然叫做交互，但是之前的内容已经讲述如何在WebBrowser中调用页面的脚本，本节就不再累述，重点讲讲如何通过网页脚本调用窗体的代码。
23.5.1.1 准备工作
本节中需要使用到的htm文件：code23-006-3.htm。
具体代码如下：
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>这是配合C#教程的网页</title>
<style>
.inputbox {
width:60px;
border: 1px solid #6699FF;
}
</style>
<script language="javascript">
function operation()
{
var args1=document.all("args1").value;
var args2=document.all("args2").value;
var option=document.all("option").value;
window.external.getValue(args1,args2,option);
function operation2()
{
var args1=document.all("args1").value;
var args2=document.all("args2").value;
var option=document.all("option").value;
finalvalues.value=window.external.getValue2(args1,args2,option);
}
</script>
</head>
<body>
<input type="text" name="args1" id="args1" value="" class="inputbox">
<select name="option" id="option">
<option value="+" checked>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" name="args2" id="args2" value="" class="inputbox">
=
<input type="text" name="finalvalues" id="finalvalues" value="" class="inputbox">
<br/><br/>
<input type="button" name="submit" id="submit" value="运算1" οnclick="operation()">
<input type="button" name="submit" id="submit" value="运算2" οnclick="operation2()">
</body>
</html>
这个htm页面运行显示如下：
图23-33 测试使用的网页
注意：网页代码脚本operation方法中window.external.方法名称(参数)，这是调用窗体提供的方法所必须的。
23.5.1.2 C#中的设置
要实现从网页上调用窗体中的代码，必须完成三项工作：
1、使窗体上的类对网页可见；
2、在WebBrowser控件中打开的网页中的脚本能够访问定义的对象；
3、调用的方法必须确保为公共的。
第一项工作可以使用以下两个方法任选其一：
1、依次打开【项目属性】|【应用程序】|【程序集信息】，勾选中【使程序集COM可见】：
图23-34 设置【使程序集COM可见】
2、直接通过代码方式，通过使用 ComVisibleAttribute 对类进行标记使其成为 COM 可见的类，在Form类前面加上：
[System.Runtime.InteropServices.ComVisibleAttribute(true)]
public partial class Form1 : Form
第二项工作：设置WebBrowser.ObjectForScripting属性，它可由显示在WebBrowser控件中的网页所包含的脚本代码访问。只需要在窗体载入时，添加如下代码：
WebBrowser1.ObjectForScripting = this;
完成以上两项工作，设置要被网页要调用的方法为public就可以了。
23.5.1.3 实现交互
【例 23.25】【项目：code23-015】插入脚本。
[System.Runtime.InteropServices.ComVisibleAttribute(true)]
public partial class Form1 : Form
{
private void Form1_Load(object sender, EventArgs e)
{
WebBrowser1.ObjectForScripting = this;
WebBrowser1.Navigate("http://localhost/code23-006-3.htm");
}
public void getValue1(string args1,string args2,string options )
{
int a1, a2;
a1 = int.Parse(args1);
a2 = int.Parse(args2);
double values;
switch( options)
{
case "+":
values = a1 + a2;
break;
case "-":
values = a1 - a2;
break;
case "*":
values = a1 * a2;
break;
default:
values = (double)a1 / (double)a2;
break;
}
HtmlElement element;
element = WebBrowser1.Document.GetElementById("finalvalues");
element.SetAttribute("value", values.ToString());
}
}
运行结果如下图所示：
图23-35 调用窗体代码的计算结果
以上代码计算出两个数的运算结果，但是并没有向网页返回值，而是直接将值写回网页。如果需要将值返回到网页脚本，那么需要如下操作：
1、将网页代码中：
window.external.getValue(args1,args2,option);
修改为：
finalvalues.value=window.external.getValue(args1,args2,option);
2、将C#中的代码由无返回值修改为返回字符串：
public string getValue(string args1, string args2, string options)
{
int a1, a2;
a1 = int.Parse(args1);
a2 = int.Parse(args2);
double values;
switch (options)
{
case "+":
values = a1 + a2;
break;
case "-":
values = a1 - a2;
break;
case "*":
values = a1 * a2;
break;
default:
values = (double)a1 / (double)a2;
break;
}
return values.ToString();
}
学习更多vb.net知识，请参看vb.net 教程 目录
学习更多C#知识，请参看C#教程 目录