Question

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);

当使用能力分数更新左侧输入时，右侧输入应反映能力修改器。 javascript的评论部分功能完善，但我真的不想为每个需要更新的输入设置单独的功能 - 一个功能在将来更容易隔离和排除故障。我喜欢要做的是有一个函数，我可以将得分和修饰符输入值作为参数传递（在这种情况下为strScore和strMod），并通过它更新修饰符字段.oninput事件。我对此的尝试低于javascript的评论部分。我觉得我只是没有连接点如何正确调用函数或正确更新传递给函数的Modifier输入。

Answer 1

将函数修改为接受dom节点而不是两个值将允许您在相对容易使用不同dom节点的单独事件中重用该函数。

videojs

更好但是能够根据触发事件的得分元素动态地找出你应该定位哪个mod元素，那么在保持代码干燥的同时你不需要单独的函数来进行计算/更新

Answer 2

呼。拉开了桌子。这是一个适合您的解决方案。您只需要确保strscore设置了id号。这样你就可以了解你想要改变的strmod。

Ex. strScore1 = strMod1 and strScore2 = strMod2

这将设置一个场景，您将来不再需要触摸JavaScript来执行相同的功能。允许您在HTML部分中添加任意数量的得分和mod对联。

我们在'input'类上绑定.attributeScore事件，这允许我们设置函数。无需传入值，因为它们已默认包含在内。只要得分输入的类别为.attributeScore，它就会触发该功能。

我们可以使用this.value来获取分数值，然后从1属性strScore1为this.id的字符串输出#strMod分数的标识符。输入字段。

如果我们将该子字符串与strMod连接起来，我们可以使用内联数学更新相应<!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">  <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>属性的值。

这是jsfiddle：http://jsfiddle.net/hrofz8rg/

<div id=skypecallbox>
    <a href="skype:live:skype.charlie.brown?chat">Chat - Blockhead (old skype)</a><br />
    <a href="sip:charie.brown@peanuts.com">Chat - Blockhead (new skype)</a>
</div>

希望有所帮助！享受！

Javascript - 调用函数.oninput

2 个答案: