0

我有几个输入字段应该只有数字作为有效输入,所以在搜索 SO 之后,我得到了以下 js 代码,只允许将数字输入到运行良好的文本字段中。

function onlyNumbers(evt) {
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode( key );
    var regex = /[0-9]|\./;
    if( !regex.test(key) ) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();

        // the corresponding span to make it visible here
        // What code to put here ?

    }
}

对应的html是

<input type="text" id="age1" onkeypress="onlyNumbers(event)" />
<input type="text" id="mobileNo" onkeypress="onlyNumbers(event)" />

现在,我在每个这样的输入文本之后都有一个隐藏的span,我想在输入无效字符后立即显示?因为这样的领域很多

例如age1、age2、mobileNo,每个人都有自己的兄弟跨度。因此,当 age1 输入错误时,应显示相应的错误消息范围。

这是供参考的最小完整html代码

<form method="POST" action="action.php">
    ...
<li>Age of person 1 :
    <input type="text" id="age1" onkeypress="onlyNumbers(event)" />
    <span class="error_msg age1"> Only numbers please </span> 
</li>
<li>Age of person 2 :
    <input type="text" id="age2" onkeypress="onlyNumbers(event)" />
    <span class="error_msg age2"> Only numbers please </span> 
</li>
<li>
    <input type="text" id="mobileNo" onkeypress="onlyNumbers(event)" />
    <span class="error_msg mobileNo"> Only numbers please </span> 
</li>
...
</form>

如何获取onlyNumbers()调用函数的元素的引用?以及如何使相应的跨度可见?有任何想法吗 ?

4

1 回答 1

1
 var fld = theEvent.target || theEvent.srcElement;

在这里您可以访问 ID 或兄弟节点

如果您改为或同时通过(this),您将拥有自己的领域

于 2012-09-02T10:50:31.007 回答