最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

calculator - Javascript on button click add value to text box - Stack Overflow

programmeradmin2浏览0评论

Just a super simple javascript question, but i cannot find out how it works

Need to get script output to the input.

original script on /

Thanks!

var theTotal = 0;
$('button').click(function(){
   theTotal = Number(theTotal) + Number($(this).val());
    $('.tussenstand').text("Total: "+theTotal);        
});

$('.tussenstand').text("Total: "+theTotal);
<script src=".1.1/jquery.min.js"></script>
<input id="tussenstand">

<button value="1">1</button>
<button value="2">2</button>
<button value="4">4</button>
<button value="6">6</button>

Just a super simple javascript question, but i cannot find out how it works

Need to get script output to the input.

original script on http://jsfiddle/mYuRK/

Thanks!

var theTotal = 0;
$('button').click(function(){
   theTotal = Number(theTotal) + Number($(this).val());
    $('.tussenstand').text("Total: "+theTotal);        
});

$('.tussenstand').text("Total: "+theTotal);
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="tussenstand">

<button value="1">1</button>
<button value="2">2</button>
<button value="4">4</button>
<button value="6">6</button>

Share Improve this question asked Mar 21, 2015 at 18:01 Joran DobJoran Dob 3605 silver badges20 bronze badges 2
  • 1 Use #tussenstand instead of .tussenstand as selector. – Guffa Commented Mar 21, 2015 at 18:06
  • @Guffa , the text should be replaced with the val , as well – Asif Mehmood Commented Mar 21, 2015 at 18:26
Add a ment  | 

3 Answers 3

Reset to default 6

Since you're using an id for the input you need to use # instead of . for the selector. And for input you have to assign the value.

So instead of $('.tussenstand').text( use $('#tussenstand').val(.

var theTotal = 0;
$('button').click(function(){
   theTotal = Number(theTotal) + Number($(this).val());
    $('#tussenstand').val("Total: "+theTotal);        
});

$('#tussenstand').val("Total: "+theTotal);
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="tussenstand">

<button value="1">1</button>
<button value="2">2</button>
<button value="4">4</button>
<button value="6">6</button>

Change the class selector to an id selector in your JS, and use val() instead of text().

var theTotal = 0;
$('button').click(function(){
   theTotal = Number(theTotal) + Number($(this).val());
    $('#tussenstand').val("Total: "+theTotal);        
});

$('#tussenstand').val("Total: "+theTotal);

val() is what jQuery uses to edit/retrieve the value of a textbox.

Use this SCRIPT:

<script>
        function insertTextInInputValue(buttonValueIs){
            var inputElementIs = document.getElementById("tussenstand");
            inputElementIs.value = inputElementIs.value + buttonValueIs;
        }
    </script>

with the HTML:

<input id="tussenstand">
<button onclick="insertTextInInputValue(1);">1</button>
<button onclick="insertTextInInputValue(2);">2</button>
<button onclick="insertTextInInputValue(3);">3</button>
<button onclick="insertTextInInputValue(4);">4</button>
<button onclick="insertTextInInputValue(5);">5</button>
<button onclick="insertTextInInputValue(6);">6</button>
发布评论

评论列表(0)

  1. 暂无评论