个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我目前正在编写JS 代码来计算数字输入的运行总数。我遇到的问题是，对于我的实际项目，我无法直接更改 HTML，因为它是从脚本程序生成的。不过我可以用 JS 来操作它。
到目前为止，我已经添加了一个 div，它可以显示输入的总和。但这仅在输入具有 onKeyUp() 属性时才有效。对于生成的 HTML 来说，情况并非如此，因此我需要编写一个 JS 脚本 将其添加进去。这就是我到目前为止所做的:
<html>
<head>
<script>
//try to set an onKeyUp attribute to the elements.
var number1 = document.getElementById("_Q0_Q0_Q0");
number1.onkeyup = function(){ return summer()};
var number2 = document.getElementById("_Q0_Q0_Q1");
number2.onkeyup = function(){ return summer()};
var number3 = document.getElementById("_Q0_Q0_Q2");
number3.onkeyup = function(){ return summer()};
function summer() {
var count = 0; //start with nothing
var num1 = (parseFloat(document.getElementById("_Q0_Q0_Q0").value)) || 0; //if there aren't any numbers, add nothing
var num2 = (parseFloat(document.getElementById("_Q0_Q0_Q1").value)) || 0;
var num3 = (parseFloat(document.getElementById("_Q0_Q0_Q2").value)) || 0;
count = num1+num2+num3; //sum them up
if (!document.getElementById("output")) { //check to see if there is a div with the output already, if not create one.
var newDiv = document.createElement('div');
newDiv.setAttribute('id', 'output');
var gutterDiv = document.getElementById("right_gutter")
gutterDiv.appendChild(newDiv);
};
document.getElementById("output").innerHTML = "Your running total = "+count
}; //show output
</script>
</head>
<body>
<input type="text" id="_Q0_Q0_Q0" name="number" />
<input type="text" id="_Q0_Q0_Q1" name="number" />
<input type="text" id="_Q0_Q0_Q2" name="number" />
<div id='right_gutter'>
<button type="button" onclick="summer()">Clicking here adds your input to the "count" variable</button> //two purposes of this. 1) Acts as a placeholder for where the output should end up. 2) Shows that the summing function works.
</div>
<br>
</body>
</html>
最佳答案
很高兴你成功了。我想这现在是多余的，但我发布这个答案以防它有用。
//Create a NodeList of all elements whose name='number':
var nums = document.getElementsByName("number");
//add the onkeyup event to all nums:
for(var n=0; n < nums.length; n++){
nums[n].onkeyup = function(){return summer()};
}
//add the click event to the button:
document.getElementById("button").onclick = function(){return summer();}
function summer() {
var count = 0;
for(var n=0; n < nums.length; n++){//iterate and sum values
count += parseFloat(nums[n].value) || 0;
}
//create the output element:
var outputDiv = document.getElementById("output") || document.createElement('div');
//if it doesnt already exist append it:
if(!document.getElementById("output")){
outputDiv.setAttribute('id', 'output');
document.getElementById("right_gutter").appendChild(outputDiv);
createdAlready=true;
}
//set the output string:
outputDiv.innerHTML = "Your running total = "+count;
}
关于javascript - 使用Javascript动态设置onKeyUp属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20615744/
25
4
0
关于如何禁用 MVC3 远程验证器具有的 onKeyup 设置，我看到了很多答案。我看到的回复是输入这个: $.validator.setDefaults({ onkeyup: false }); 但
所以我正在为历史课制作模拟版本的谷歌审查制度。我试图让搜索在按回车键后开始工作，但到目前为止，我得到的只是对我输入的第一个字母的搜索。有什么建议么？ HTML代码: Jav
据说 onkeyup 方法没有定义，但是，该方法是我的 ide 自动推荐给我的。当我在 chrome 开发工具中查看错误时，出现错误 Uncaught TypeError: Object [objec
这个问题在这里已经有了答案: How to delay the .keyup() handler until the user stops typing? (28 个回答) 关闭6年前. 我想创建一个
我有一堆 HTML 数字输入，我已经通过以下方式获取了它们 x=document.querySelectorAll('input[type="number"]'); 然后，我尝试使用 for 循环对其
我有一些输入字段，它们使用 onKeyUp="script" 在输入内容时返回数据。 作为一种快捷方式，我希望能够在从另一个位置输入数据并触发脚本时向其中一个字段添加值。 我可以使用 document
出于某种原因，对于 IE9 上的某些人来说，我的 onkeyup 似乎被触发了两次。 我当前的函数如下所示: document.getElementById("chatboxtextarea").on
我创建脚本在 keyup 上按出生日期获取年龄，但是 我有个问题。因为，当我打字时 示例:我输入:1955-11-13 此结果显示 NaN 这是我的脚本: $(document).read
jquery中有没有等于onkeyup=""的函数 我已经找到了change()，但是这只在模糊时执行警报，我希望它像实时搜索一样，当你写“a”(想要写anton)时，它应该执行该函数。所以当你写5时
在阅读了一堆问题并对其应用“解决方案”后，我发现 jQuery 验证器未验证 onkeyup。默认情况下，应该如此。我通过下载新文件来确保源代码没有被修改，什么都没有。 版本:jquery 1.10.
我在 jquery 函数中有以下 if 语句，由文本输入字段中的 onKeyUp 触发 if ( famcount 10 ){ alert('number too large.'); } 问
我有一个 ExtJS 组合框，这是一个必填字段，但我不希望在我尝试提交表单之前显示必填字段错误消息。现在，它似乎发生在 keyup 上。我已将 validateOnBlur 设置为 false，但它仍
我的预期输出是 当我在输入文本字段中输入时，我会在第三个文本字段上得到即时总和 如果我在第一个文本字段中输入 3 并且按键已按下，则 3+0=3 必须立即显示在第三个字段上 但没有显示任何结果
我知道这个问题已经被问了很多次 - 但我找到的所有答案都很旧，而且似乎不起作用(至少对我来说)。 我使用以下代码从输入框进行实时预览 $('#attractionName').on('keyup',
我需要在 keyup 和 onsubmit 上进行验证。我有一个名为 CVV 的字段，它接受 3 位或 4 位数字，所以我使用的是“^(d){3,4}$”。当我在 onsubmit 函数中执行此模式时
我正在尝试确定用户按下某个键后的时间量(秒)。这是一个输入框的值。 我想在文本框的值发生变化时实用地调用 updateData 函数，但仅在 onKeyUp 的特定持续时间之后。 我目前正在检查 va
我有一个包含许多动态插入范围的 contentEditable 字段。 当我使用 onclick() 事件中的 getTarget() 时，我将目标作为相应的跨度，但使用 onkeyup() 和 on
到目前为止我做得很好，但我无法将其实现到 html 对象中。 http://jsfiddle.net/fkyk2b8y/48/ 假设我有一个像 这样的 html 元素我想这样实现: function
我有一个供人们输入用户名的输入文本框，它有一个附加的 onkeyup 事件属性，它会触发 AJAX 请求以检查用户名是否已被占用。 第一个键到第二个键之间的延迟是多少？意思是如果我一个接一个地输入一个
我似乎没有找到哪个版本的“onkeyup”是正确的: 驼峰式:onKeyUp 或 小写:onkeyup [更新] http://www.w3.org/TR/html4/intro/sgmltut.ht
我是一名优秀的程序员,十分优秀！