[Vlasenko Fedor]

<style>
.podbor{position: relative;}
.podbor>input{
    padding: 2px 2px 1px 4px; 
    font-size:30px; 
    width: 70px;
    height: 40px;
    float: left;
    border: 1px solid #666;
    border-radius: 4px 0 0 4px;
}
.podbor>span{
    display: block;
    font-size:18px; 
    position:absolute; 
    left: 58px;
    margin: 0;
    padding: 2px;
    line-height:14px;
    width: 14px;
    border: 1px solid #666;
    background-color: #E4E4E4;
    text-align: center;
    cursor: pointer;
}
.podbor>.plus{border-bottom: none; height: 16px;}
.podbor>.minus{top: 20px; height: 14px;}
.podbor>span:hover{background-color: #999;}
.clear{clear: both;}
</style>
<div class="clear"></div>
<div class="podbor">	
    <input type="text" value="1"/>
    <span class="plus">+</span>
    <span class="minus">-</span>
</div>
<div class="clear"></div>
<hr>
<div class="clear"></div>
<div class="podbor">	
    <input type="text" value="1"/>
    <span class="plus">+</span>
    <span class="minus">-</span>
</div>
<script>
(function () { 
    document.onclick = function(e){    
        e = e || window.event;
        var target = e.target || e.srcElement;
        if ('SPAN' != target.tagName || 
            !(target.className == 'minus' || target.className == 'plus')) return false;
        var el = target.parentNode || target.parentElement,
        inp = el.children[0],
        val = +inp.value;  
        inp.value = val + (target.className == 'minus' ? val > 1 ? -1: 0: 1);
     }
}());
</script>