Web 表单中的进度条

2023-12-28

我正在 .net 中创建一个网络表单,其中大约有 14 个字段。 我想在网络表单的末尾创建一个进度条,它将显示以下状态 表格填写。如果表格的所有字段都已填写,则会显示 100% 正在进行中 栏,否则它将根据表单状态显示一些%。

我怎样才能在.Net 中完成这个任务?有没有适合这项特定工作的ajax扩展器


您可以只使用两个 div,并调整内部 div 的大小以显示进度,如本例所示。 编辑字段时,将调用“检查”函数,该函数检查字段并更新进度条。

<html>
<head>
<script type="text/javascript">
    function check() {
        var completion = 0;
        if (document.getElementById("field1").value != "") {
            completion++;
        }
        if (document.getElementById("field2").value != "") {
            completion++;
        }
        if (document.getElementById("field3").value != "") {
            completion++;
        }
        document.getElementById("progressbar").style.width = completion*20+"px";
    }
</script>
</head>
<body>
<form action="script.aspx" method="GET">
    Name: <input type="text" id="field1" onchange="check()" /><br />
    Tel No.: <input type="text" id="field2" onchange="check()" /><br />
    Email: <input type="text" id="field3" onchange="check()" /><br />
    Completion: <div style="width: 60px; height: 10px; border: 1px solid black;">
        <div style="width: 0px; height: 10px; background-color: green;" id="progressbar">&nbsp;</div>
    </div>
    <input type="submit" />
</form>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Web 表单中的进度条 的相关文章

随机推荐

  • AJAX向WebApi传递多个参数

    AJAX 请求 ajax url url dataType json type Post data token 4 feed id 0 message Hello World userId 4 服务器端 Web API HttpPost p
  • 使用外部框架构建 Objective-C 应用程序

    我正在整合growl http growl info documentation developer implementing growl php lang cocoa进入我的 Objective C 应用程序 但是 如果我构建并运行我的应
  • C、硬件抽象层中“extern”类型的变量

    我正在研究硬件抽象层 该 HAL 的目的是在 Linux 驱动程序和 MCU 驱动程序之间轻松切换 我正在研究SPI接口 下面是 打开 SPI接口的HAL函数的签名 哈尔 spi h spi handle t spi open spi po
  • 将多个通用接口传递给一个方法

    我试图将多个通用接口作为参数传递给我的类之一的构造函数 以下代码无法编译 public interface IPosterGenerator
  • 如何使用Gradle将Android配置注入到每个子项目中?

    而不是在每个子项目中复制 android 配置块 android compileSdkVersion 19 buildToolsVersion 19 0 0 defaultConfig minSdkVersion 9 targetSdkVe
  • 为什么使用“set var = value”获取脚本会破坏 $@?

    我正在尝试在 Centos 虚拟机上配置自动注销 我注意到 如果我在 etc profile d autologout sh 创建一个文件 仅set autologout 30在文件中 然后它会中断为任何源自 etc profile 的脚本
  • 如何通过拖动来调整 PyQt 小部件的大小?

    我有一个 QScrollArea 其中包含一个带有 QVBoxLayout 的小部件 该布局内还有其他几个小部件 我希望用户能够拖动这些小部件的下边框以在垂直方向上调整它们的大小 当它们调整大小时 我不希望它们从滚动区域中的其他小部件 窃取
  • 使用 GDI+ 将 24 bpp 转换为 4 bpp

    我的程序当前采用 4 bpp 每像素位数 TIFF 作为位图 将其转换为图形 添加一些文本字符串 然后再次将其保存为 TIFF 文件 默认情况下 输出 Bitmap Save TIFF 文件似乎为 24 bpp 无论输入如何 并且比原始 T
  • Snowflake服务器的规格是什么?

    当谈到集群大小时 文档指出 例如 XS 集群由 1 台服务器组成 但我一直在寻找服务器规范 但似乎找不到有关此主题的任何文档 对于 AWS Snowflake 如果您在 Chrome F12 中打开浏览器控制台并在普通的 Snowflake
  • 如何安装“Visual studio emulator for android”模拟器的证书?

    我正在研究一个Xamarin 表单需要打电话的httpclient使用公司的内部 https REST api 不幸的是 它返回此错误 Javax Net Ssl SSLHandshakeException java security ce
  • 使用 jQuery 删除所有数据表

    所以 我将数据表与 jQuery 一起使用 但我有点困惑为什么这不起作用 我的 HTML 看起来像这样 table border 1 class display partitionDisplay caption Partitions cap
  • process.waitFor() 永远不会返回

    Process process Runtime getRuntime exec tasklist BufferedReader reader new BufferedReader new InputStreamReader process
  • 使用 JAVA 将希伯来语写入 mySql

    我有一个小的 Java 方法 可以将短消息插入 MySQL 数据库 该表的默认排序规则是utf8 unicode ci java代码是 private void insertMessageToDataBase String lRoom St
  • 这个登录逻辑是通过RESTful调用声音实现的吗?

    我不是在谈论对 RESTful API 的调用进行身份验证 我是在谈论通过 RESTful API 为用户创建登录逻辑 当用户访问我网站的任何页面时 servlet filter将拦截请求并检查是否有必要authentication inf
  • 在asp.net mvc视图中将字符串显示为html

    我有一个控制器 它生成一个包含 html 标记的字符串 当它显示在视图上时 它显示为包含所有标签的简单字符串 我尝试使用 Html 助手进行编码 解码以正确显示它 但它不起作用 string str a href Home Profile
  • numpy.loadtxt 不读取复数文件

    我正在尝试读取具有以下形式的复数的文件 data dat 1 5795219122457646E 11 3 852906516379872E 15i 3 5949335665378405E 12 1 626143709108086E 15i
  • 手风琴内的 flexslider 行为问题

    我有一个测试页 http bellotaestudio com test test html更好地解释我的问题 我的列表中有几个项目 它们是测试页上的图像 当我点击其中一个时 相应的幻灯片 使用flexslider 向下滑动 问题在于 在页
  • Symfony 登录身份验证返回错误:在非对象上调用成员函数 toArray()

    我正在开发一个使用 symfony 2 5 构建的网站 要求是每个用户只需要拥有一个角色 用户不能拥有超过 1 个角色 因此在用户名和密码所在的用户表中还有另一列名字role其中包含ROLE ADMIN对于管理员和ROLE STAFF对于公
  • 如何从存储库中删除所有已删除的文件?

    我有一个脚本 在其中添加所有新文件 然后使用以下行将我的工作副本提交到我的存储库 svn status grep awk print 2 xargs svn add 我现在想添加一行 从存储库中删除工作副本中所有已删除的文件 换句话说 我无
  • Web 表单中的进度条

    我正在 net 中创建一个网络表单 其中大约有 14 个字段 我想在网络表单的末尾创建一个进度条 它将显示以下状态 表格填写 如果表格的所有字段都已填写 则会显示 100 正在进行中 栏 否则它将根据表单状态显示一些 我怎样才能在 Net