我想在单击按钮时使用JavaScript插入文本。但是".value()"似乎不起作用

这是代码片段。请帮我解决这个bug：/我想做的是，当我点击按钮时，它应该在输入栏中插入一些值

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>

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>

单击按钮时，可以使用此函数将文本添加到输入中。

<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>

相关内容

最新更新

热门标签：