删除文本框
本文关键字:文本 删除 | 更新日期: 2023-09-27 18:20:03
我知道这可能是一个简单的问题,但我一直在寻找一种方法来删除按钮点击时的文本框,我用这行代码添加了文本框。
function SearchAddressFields(){
my_div.innerHTML = my_div.innerHTML + "<br> <label for='txtSearch'>Street Number:</label> <input type='text' id='txtStreetNum' />"
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>PreDir:</label> <input type='text' id='txtPreDir' />"
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>PreType:</label><input type='text' id='txtPreType' /> "
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>Street Name:</label><input type='text' id='txtStreetName' /> "
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>Suf Dir</label><input type='text' id='txtSufDir' />"
my_div.innerHTML = my_div.innerHTML + "<input type='button' id='btntest' onclick='searchAddress()' value='Search'/>"
my_div.innerHTML = my_div.innerHTML + "<input type='button' id ='reset' onclick='resetbutton()' value='Reset' />"
}
这可能是错误的方法,但对我来说很有效。如果再次单击同一按钮,有什么方法可以删除元素吗?
任何帮助都将不胜感激
您的问题被标记为"jquery",因此希望这将有所帮助:
在您的函数之外,您可以有另一个变量来跟踪是否添加了元素:
var haveElementsBeenAdded = false;
function SearchAddressFields(){
if(!haveElementsBeenAdded){
my_div.innerHTML = my_div.innerHTML + "<br> <label for='txtSearch'>Street Number:</label> <input type='text' id='txtStreetNum' />";
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>PreDir:</label> <input type='text' id='txtPreDir' />";
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>PreType:</label><input type='text' id='txtPreType' /> ";
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>Street Name:</label><input type='text' id='txtStreetName' /> ";
my_div.innerHTML = my_div.innerHTML + "<label for='txtSearch'>Suf Dir</label><input type='text' id='txtSufDir' />";
my_div.innerHTML = my_div.innerHTML + "<input type='button' id='btntest' onclick='searchAddress()' value='Search'/>"
my_div.innerHTML = my_div.innerHTML + "<input type='button' id ='reset' onclick='resetbutton()' value='Reset' />" ;
haveElementsBeenAdded = true;
}
else{
$(my_div).find('input').remove();
$(my_div).find('label').remove();
haveElementsBeenAdded = false;
}
}
不过,以上内容并没有删除不间断的空格。
在文本框上放置一个类,如class="HideTheseTextBoxes"
使用jQuery来隐藏onclick事件上的那些
$( ".HideTheseTextBoxes" ).hide();