个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
HTML:
<input type="number" id="strScore" class="attribScore" min=8 max=15>
<input type="number" id="strMod" class="attribMod" readonly="readonly">
Javascript:
/****************************************************************
document.getElementById("strScore").oninput = function update(e) {
var result = document.getElementById("strMod");
var attribScore = $('#strScore').val();
result.value = (Math.floor((attribScore / 2) -5));
}
******************************************************************/
var strScore = $('#strScore').val();
var strMod = $('#strMod').val();
var update = function(score, mod) {
attribMod = (Math.floor(score / 2) - 5);
mod.value = attribMod;
};
update(strScore,strMod);
当左侧输入更新为能力得分时，右侧输入应反射(reflect)能力修饰符。javascript 的注释部分功能完美，但我真的不想为每个需要像这样更新的输入提供单独的函数 - 一个函数在将来更容易隔离和排除故障。我想要做的是拥有一个函数，我可以将分数和修饰符输入值作为参数(在本例中为 strScore 和 strMod)传递给该函数，并让它通过 .oninput 更新修饰符字段事件。我对此的尝试位于 javascript 的注释部分下方。我觉得我只是没有将如何正确调用函数或正确更新传递给函数的修饰符输入的点联系起来。
最佳答案
唷。被人从 table 上拉开。这是为您提供的解决方案。您只需要确保 strscore 设置有 ID 号即可。这样您就可以了解您想要更改的 strmod。
例如。 strScore1 = strMod1 和 strScore2 = strMod2
这将设置一个场景，您将来无需再接触 JavaScript 即可执行相同的功能。允许您在 HTML 部分添加任意数量的乐谱和调制对句。
我们将 'input' 事件绑定(bind)到 .attributeScore 类上，这允许我们设置函数。不需要传递值，因为默认情况下它们已经包含在内。只要分数输入具有 .attributeScore 类，那么它就会触发该函数。
我们可以使用 this.value 获取分数值，然后对 strScore1 的分数身份进行子字符串化，即 1 > 来自输入字段的 this.id 属性。
如果我们将该子字符串与 #strMod 连接起来，我们可以使用内联数学更新相应的 strMod 属性的值。
这是 jsfiddle:http://jsfiddle.net/hrofz8rg/
<!DOCTYPE html>
<html>
<head>
<title>Some JavaScript Example</title>
</head>
<body>
<input type="number" id="strScore1" class="attribScore" min=8 max=15>
<input type="number" id="strMod1" class="attribMod" readonly="readonly">
<br>
<br>
<input type="number" id="strScore2" class="attribScore" min=8 max=15>
<input type="number" id="strMod2" class="attribMod" readonly="readonly">
<!-- JavaScript -->
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
$(".attribScore").bind({
'input':function(){
var attrib_num = this.id.substring(8,this.length);
$('#strMod' + attrib_num).val((Math.floor(this.value / 2) - 5));
}
});
</script>
</body>
</html>
希望有帮助!享受吧!
关于javascript - 调用函数.oninput，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33551833/
26
4
0
我正在使用 Blazor 服务器端。 我有几个输入框绑定(bind)到不同的值，但只要有输入，它们就必须调用相同的函数。该函数本质上启动计时器，用于在 X 时间过去后保存数据。 Summary: 我
我正在使用 Blazor 服务器端。 我有几个输入框绑定(bind)到不同的值，但只要有输入，它们就必须调用相同的函数。该函数本质上启动计时器，用于在 X 时间过去后保存数据。 Summary: 我
我在oninput="setCustomValidity('')标记上完美地使用了这个input，但是它似乎在select标记中不起作用。这在select标记中有效吗？ 最佳答案 只是否，不适用于s
我遇到了 JavaScript 函数仅触发一次的问题。 我一开始在函数中使用了更简洁的结构，但将其分解为离散的操作，看看我是否能弄清楚任何事情。行为完全相同。 在我的 HTML 中，在 HEAD 标记
我做错了什么导致onInput报告的值是后面的一个字符？ 例如，在文本字段中键入“mil”以过滤到里程碑行。然后将其删除，恢复为空，您将看到其仍在过滤的里程碑(另请参阅浏览器控制台以查看该值仍然是“m
我做错了什么导致onInput报告的值是后面的一个字符？ 例如，在文本字段中键入“mil”以过滤到里程碑行。然后将其删除，恢复为空，您将看到其仍在过滤的里程碑(另请参阅浏览器控制台以查看该值仍然是“m
JSFIDDLE HTML: Javascript: /**************************************************************** docum
我的 friend 们，下面的代码曾经在 Chrome 52.x 版本之前工作，但在最新版本中它不再工作了。你们中有人知道为什么它不起作用吗？ https://jsfiddle.net/2jtrs2m
为了提供条目的预览，我使用了 jQuery，如下所示 $('#text').on('input',function(){ $('#previewText').html($('#text').v
以下代码不适用于所有输入元素: $(':input').on('input', function(){ alert('boom shakalaka'); }); 它对复选框没有影响，即使它们是输入
我正在创建一个打字测试页面并遇到了一个小问题。 我试图在用户键入时启动计时器，并且使用 onInput 有效，但问题是每次我键入 textArea 时它都会注册，这会导致 starttimer 函数自
一周前，我终于找到了一种将消息分成不同类别的方法 (Here is the SO question where I got my answer) 现在我已经实现了这个解决方案: type Msg
晚上好， 我在修改测试对象中的日期值时遇到问题。 oninput 事件似乎只在加载文档时触发一次。当日期更改时，oninput 事件似乎不会触发。 var TestO
我正在尝试通过这种方式填充“oninput”: var $el = document.getElementById("ctx"); if( "oninput" in $el ) { // nati
我想用文本框本身的值和另一个输入框的值来设置文本框的数据值。我已经编写了简单的 JavaScript 代码片段来在 oninput 属性处处理此问题，但它并未使用预期值更新 data-value 属性
我正在尝试通过获取用户的颜色输入来实时调整渐变。每当我调整一个值时，我都会收到错误 - 它表明未给出另一个值。 function btnGradient(input1, input2){ btn.s
我正在构建一个计算天数差异的应用程序。有多个可能使用或不使用的日期选项。因此，我正在构建一个 switch/case 逻辑流程来计算不同的变量组合。一切正常，除了我似乎无法获取函数 add_sd()
比如说，我需要在自定义元素中调用一个函数，这样当 slider 在该元素中移动时，文本会得到更新(仅针对该元素)。 main.js文件， class OninputClassDemo extends
这个问题已经有答案了: Regex accept numeric only. First character can't be 0 (7 个回答) 已关闭 6 年前。 我正在尝试创建一个仅允许具有任意
我有一个数字输入字段，我想像这样在 oninput 上调用一个函数。 function onInput(){ $('.left-arrow' ).click(function(e) {
我是一名优秀的程序员,十分优秀！