I have an input box. Where I run commands to filter contents. When a user inputs in the box then the table of contents anchor is not working. So, I want to reset input and trigger the delete keypress one time on click UL anchor tag, when a user clicks on the UL anchor.
$(document).on("click", "ul a", function () {
$("#myInput").val("");
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="inarea">
<input id="myInput" type="text" value="12345678">
</div>
<ul>
<li><a href="#abc">ABC</a></li>
<li><a href="#def">DEF</a></li>
<li><a href="#xyz">XYZ</a></li>
</ul>Is this what you are looking for?
So what I did is I simply set the value of the input to "" which means none.
Please tell me if this is helpful so that I can change my answer, Thank You.
const buttons = document.querySelectorAll("a");
for (const button of buttons) {
button.addEventListener('click', function(event) {
document.getElementById('myInput').value = "";
})
}.button {
color: #fff;
padding: 11px;
margin: 15px;
display: block;
text-transform: uppercase;
background: #0d496f;
font-size: 13px;
border-radius: 0;
float: left;
font-weight: 700;
cursor: pointer;
width: 15%;
text-align: center
}
<div class="inarea">
<form id="form">
<input id="myInput" type="text" value="12345678">
</form>w
</div>
<ul>
<li><a href="#abc">ABC</a></li>
<li><a href="#def">DEF</a></li>
<li><a href="#xyz">XYZ</a></li>
</ul>
</div>you can use the document.execCommand("delete"); function to emit the delete key press.
$(document).on("click", "ul a", function () {
$("#myInput").val("");
document.execCommand("delete");
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="inarea">
<input id="myInput" type="text" value="12345678">
</div>
<ul>
<li><a href="#abc">ABC</a></li>
<li><a href="#def">DEF</a></li>
<li><a href="#xyz">XYZ</a></li>
</ul>but this would make no use. you can use the selectionStart and selectionEnd properties of the input element to select a part or whole of the input text, and then use the document.execCommand("delete"); to delete the text