如果用户编辑字段,则Html字段增量符会中断

时间:2014-07-15 15:34:05

标签: javascript html

下面我的代码对我来说有问题。它的目的是增加“输入类=数量”。除非用户输入他们自己的号码然后决定他们想要使用增量按钮返回,否则这很有效。我的印象是,一旦编辑了字段,我就再也无法引用该值,但我不确定原因是什么或是一个正确的解决方案。帮助将不胜感激。

<html>
<head>
<script>

function qtyPlus(fieldId){
    var curVal = parseInt(document.getElementById(fieldId).value);

    if(isNaN(curVal)) {
        document.getElementById(fieldId).setAttribute('value', 0); 
    }
    else {
        document.getElementById(fieldId).setAttribute('value', curVal+1);
    }
}

function qtyMinus(fieldId) {
    var curVal = parseInt(document.getElementById(fieldId).value);

    if(isNaN(curVal)) {
        document.getElementById(fieldId).setAttribute('value', 0);
    }
    else {
        if(curVal != 0) {
            document.getElementById(fieldId).setAttribute('value', curVal-1);
        }
    }
}

</script>
</head>

<body>

<input type='button' value='-' onclick='qtyMinus("numOfAttendees")' class='qtyminus' >       
<input type='text' value='0' class='qty' id='numOfAttendees' >
<input type='button' value='+' onclick='qtyPlus("numOfAttendees")' class='qtyplus' >

</body>
</html>

1 个答案:

答案 0 :(得分:0)

更改您的js:

function qtyPlus(fieldId){
    var curVal = parseInt(document.getElementById(fieldId).value);

    if(isNaN(curVal)) {
        document.getElementById(fieldId).value = 0; 
    }
    else {
        document.getElementById(fieldId).value = curVal+1;
    }
}

function qtyMinus(fieldId) {
    var curVal = parseInt(document.getElementById(fieldId).value);

    if(isNaN(curVal)) {
        document.getElementById(fieldId).value = 0;
    }
    else {
        if(curVal != 0) {
            document.getElementById(fieldId).value = curVal-1;
        }
    }
}

测试:http://jsfiddle.net/7dhjT/