How to show the button on click value?-CodePudding

I'm a beginner at programming.

When I click the button, The value of the button... I want it to be displayed as input.

And, when i click it several times, The corresponding value is added. I want to mark it.

I'm searching the Internet, but it's not working. Please help me. Thank you.

        <script>
                $(document).ready(function(){
                $('#myform input').on('change',function(){
                var cvalue=$("[type='button']:onclick").val();
                $('#cvalue').val($("[type='button']:onclick").val());
                });
                });
        </script>         <div >
                <input type="text" id="cvalue" >
        </div>
                <button  type = "button" value="100,000">100,000</button>
                <button  type = "button" value="200,000">200,000</button>
                <button  type = "button" value="300,000">300,000</button>
                <button  type = "button" value="500,000">500,000</button>
                <button  type = "button" value="1,000,000">1,000,000</button>

CodePudding user response：

this could help you:

$(document).ready(function() {
    $('#myform button').on('click', function() {
        $('#cvalue').val($(this).val());
    });
});

CodePudding user response：

<!DOCTYPE html>
<html>
<body>

<h1>The button Element</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    var value = $(this).attr("value");
    $('#cvalue').val(value);
  });
});
</script>    
<div >
 <input type="text" id="cvalue" >
</div>
  <button  type = "button" value="100,000">100,000</button>
  <button  type = "button" value="200,000">200,000</button>
  <button  type = "button" value="300,000">300,000</button>
  <button  type = "button" value="500,000">500,000</button>
  <button  type = "button" value="1,000,000">1,000,000</button>

</body>
</html>

Use this approach.

CodePudding user response：

Vanilla Javascript Solution:

After clicking on any button you provided, the value of the clicked button will be copied to the input.

"use strict";
let input = document.getElementById("cvalue");
let button = document.querySelectorAll(".button1");
button.forEach(item => {
  item.addEventListener("click", () => {
    input.value = item.value;
  });
});

<div >
  <input type="text" id="cvalue"  />
</div>
<form>
  <button  type="button" value="100,000">100,000</button>
  <button  type="button" value="200,000">200,000</button>
  <button  type="button" value="300,000">300,000</button>
  <button  type="button" value="500,000">500,000</button>
  <button  type="button" value="1,000,000">1,000,000</button>
</form>