个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
目前我开发了一个程序，可以获取所有输入字段的计数，并将单独填写的字段数量的百分比相加。
我现在需要的是，我需要为每个输入字段分配一个数字，当用户填写输入字段时，我需要将其作为“SCORE ”显示给用户。
下面是我构建的程序。
<html>
<body>
<label> Name </label>
<input class="track"/>
<label> Name </label>
<input class="track"/>
<h5>Profile Strength <span class='perc'>0</span>%</h5>
</body>
</html>
JavaScript 是
<script>
$('.track').change(function(e) {
update_progress();
});
// supports any number of inputs and calculates done as %
function update_progress() {
var count = $('.track').length;
var length = $('.track').filter(function() {
return this.value;
}).length;
var done = Math.floor(length * (100 / count));
$('.perc').text(done);
$('.meter').width(done + "%");
}
因此，当您填写第一个输入字段时，“个人资料强度”将显示 50%，因为只有 2 个输入字段，而当您填写第二个输入字段时，它将显示 100%。
我想在这里显示一个数字而不是百分比
输入1 = 10
输入2 = 20
因此，当用户填写输入 1 时，他的“SCORE”将为 10，当用户填写下一个输入时，总数必须添加并实时显示 30。
抱歉，如果让一些开发人员感到困惑，但这是我理解我收到的任务的唯一方法。
最佳答案
尝试以下操作:网页:
<html>
<body>
<label> Name </label>
<input class="track" data-score=10 />
<label> Name </label>
<input class="track" data-score=20 />
<h5>Profile Strength <span class='perc'>0</span>%</h5>
<h5>Score <span id="score">0</span></h5>
</body>
</html>
JS:
$('.track').change(function(e) {
update_progress();
});
// supports any number of inputs and calculates done as %
function update_progress() {
var score = 0
$('input.track').each(function(){
var _score = $(this).data("score")
if ($(this).val().length > 0) {
score += _score
}
})
$('#score').text(score)
var count = $('.track').length;
var length = $('.track').filter(function() {
return this.value;
}).length;
var done = Math.floor(length * (100 / count));
$('.perc').text(done);
$('.meter').width(done + "%");
}
或者，现场版本https://jsfiddle.net/wmt6cznh/2/
这是你想要实现的目标吗？
关于javascript - 向用户填写表单的每个输入字段添加分数并显示它，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58296961/
24
4
0
在 JConsole 的 MBeans 选项卡中查看我的应用程序的 MBean 时，有“属性”和“操作”的子菜单。如果将这些树结构展开到最大程度，然后单击其中一个操作，则右侧面板会显示三个部分:操作调
我有一个包含稀疏数据的人性化工作表: PART | FRUIT --------------- Alpha | | Apples | Pears Beta |
我有一个包含每小时数据的数据框: area date hour output H1 2018-07-01 07:00:00 150 H1
假设我有这样的 html 表: 16 3 2 13 5 10
我已经将一些原始数据导入到 R 中，如下所示: 表 1: ID Year Value 01 1999 25 01 2000 12 01 2002
我已经将一些原始数据导入到 R 中，如下所示: 表 1: ID Year Value 01 1999 25 01 2000 12 01 2002
我在以下问题中遇到了同样的问题: Forward Fill New Row to Account for Missing Dates 不同之处在于，我需要计算两个不同日期之间的小时数差异，例如 201
我想填写 pandas 数据框中缺失的值。最佳情况下，我希望分钟列的范围为每小时 0-60。不幸的是，数据生成过程没有记录任何 sub_count = 0 的行。有办法做到这一点吗？我的数据涵盖日期
基本对象问题我似乎无法全神贯注。我确定我想多了。填写 addFullName 函数的代码。该函数应该: Take one input parameter, a person object. Add a
是否可以在没有用户交互的情况下调用 html 表单提交？我知道可以通过 HttpClient 发出发布请求，但这并不能解决我的问题。 我需要以编程方式在网页上填写一些表单输入字段，然后“单击”提交按钮
Python 的新手，似乎无法找到我正在寻找的确切答案我相信有更简单的方法来填写此信息 我有 df1 和 df2 df1: FirstName LastName PhNo uniqueid df
您好，我有一个需要填写的 PDF 表单。该应用程序向用户(表单)提出问题，提交时应将答案填写到 PDF 空白处以供打印。 我熟悉 JS 和 Node(有一段时间没用过)。不使用 PHP。 我会在我常去
假设我有一个如下所示的数据框: ID DATE VALUE 1 31-01-2006 5 1 28-02-2006 5 1 31
我想做的是，在填写四个字符时指向下一个选项卡。每个字段应有 4 个字符，完成后应移至下一个输入框。 $(".inputs").keyup(function () { if (this
我有 3 个 div，每个都有几个输入字段和下一步按钮。我想编写一个 jQuery 片段，当单击下一个按钮时，它会检查以确保与按钮位于同一 div 内的所有输入字段都不为空。 我已经尝试了以下但没有成
我正在做一个刽子手项目。我已经让大部分代码正常工作了。 我无法工作的部分是“ secret 单词”有多个相同的字母。例如“hello”有 2 个“l”。 这是代码部分的代码，如果猜测正确，它将“---
拥有抽象对象的集合:Set foes; 我想要一个这样的方法: List getFoesByType(TypeEnum type); 我已经尝试过: List result = new ArrayLi
我正在尝试使用 scrapy 填写 POST 表单，以尝试预订火车票。 我以为 FormRequest 类可以做这件事，但我无法处理 javascript 表单。 Scrapy 爬虫什么都不返回。 我
我使用以下代码生成带有渐变的图像。我逐个元素访问数组。有更好的方法吗？谢谢。 import cv2 import numpy as np x = np.ndarray((256,256,3), dty
我有一个数据对应于数据库列表和差异行，以及它们的使用日期。 DB Dates USAGE ABC 03-06-2018 IN USE
我是一名优秀的程序员,十分优秀！