I want to insert text using JavaScript when I click on button. But ```.value()``` doesn't seems to work
Question
Here is the code snippet. Please help me out with this bug:/ What I want to do is when I click the button it should insert some value in the input bar
function insertText() { try { document.querySelector('#input').value('Clicked'); } catch (err) { console.log("ERROR") } }
* { margin: 0; padding: 0; box-sizing: border-box; }.container { height: 60vh; width: 100vw; display: grid; place-items: center; border: 2px solid blue; }.btn { height: 40vh; border: 2px solid red; width: 100vw; display: grid; place-items: center; }.btn>button { padding: 10px 40px; }
<div class="container"> <input type="text" value="" id="input"> </div> <div class="btn"> <button oncanplay="insertText()" id="butt">INSERT SOME TEXT</button> </div>
2 answers
solution1
3 2021-12-29 06:50:02
function insertText(){ try{ document.querySelector('#input').value = "Lorem Ipsum"; }catch(err){ console.log("ERROR"); } }
*{ margin: 0; padding: 0; box-sizing: border-box; }.container{ height: 60vh; width: 100vw; display: grid; place-items: center; border: 2px solid blue; }.btn{ height: 40vh; border: 2px solid red; width: 100vw; display: grid; place-items: center; }.btn>button{ padding: 10px 40px; }
<div class="container"> <input type="text" value="" id="input"> </div> <div class="btn"> <button onclick="insertText()" id="butt">INSERT SOME TEXT</button> </div>
solution2
0 2021-12-29 07:45:02
You can use this jQuery function to add the text to the input.
<script>
$(document).ready(function () {
$("#setBtnID").click(function () {
$("input:text").val("Hello World!");
});
});
</script>
* { margin: 0; padding: 0; box-sizing: border-box; }.container { height: 60vh; width: 100vw; display: grid; place-items: center; border: 2px solid blue; }.btn { height: 40vh; border: 2px solid red; width: 100vw; display: grid; place-items: center; }.btn>button { padding: 10px 40px; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <head> <script> $(document).ready(function () { $("#setBtnID").click(function () { $("input:text").val("Hello World;"); }); }); </script> </head> <body> <div class="container"> <input type="text" value="" id="input"> </div> <div class="btn"> <button id="setBtnID">INSERT SOME TEXT</button> </div> </body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Delete button in a table using Javascript doesn't work. I cannot get the value of the edit button. I have this code:
The inputs are not showing up at all when I click on the button. If I remove the form an html then it works but I want it to work in form
I want to add text field when i clicked the button “add”. But it doesn't work. Help me
I have a SMSgateway JavaScript API which I want to integrate with my website, somehow it doesn't seems to work
On button click I want to set the value of text field to zero using JavaScript
On button click I want to increment the value of text field by one using Javascript
I want text to change with a button. Can't put images or anything in it
I do not want all the "addToBasket" buttons to change when i click on a specefic "addToBasket" button. Only the clicked button should change
datatable is displaying old value when i click next or previous button.
When i click into text it works but when i click beside text it doesn't work in dropdown menu?
Related Tags