<form id="form"> <input type="text" class="form-control" name="number /> <button class="btn" type="button" onclick="fun();>Принять</button> </form> function fun() { var str = document.getElementById("form").value; alert(str); }

There are several forms of this type, their code is absolutely the same. How to make it so that the data that I enter in the <input> field, when you press the <button> transferred to one function, and for example, alert(); while displaying different content. That is, I entered into the fourth field 2 - a window with the number two appeared.

  • Clarify the question. What is the fourth field? Why should a different alert be displayed? If there are several identical forms, then why forms have id ? - user207618 pm
  • @Other no matter what field, it is about passing the value to the handler. id is an attribute of the page theme. - Straight Edge

1 answer 1

See an example. Do you mean it? I also did not understand why creating forms, if they still do not have a submit button.

 var myHandler = function(text) { $('#result').text(text); // здесь был я .. или alert(); }; $('form button').click(function(e) { var text = $(this).siblings('input').val(); myHandler(text); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form> <input type="text" class="form-control" name="number" /> <button class="btn" type="button">Принять</button> </form> <form> <input type="text" class="form-control" name="number" /> <button class="btn" type="button">Принять</button> </form> <form> <input type="text" class="form-control" name="number" /> <button class="btn" type="button">Принять</button> </form> <form> <input type="text" class="form-control" name="number" /> <button class="btn" type="button">Принять</button> </form> <div id="result"></div>