删除文本框

时间:2014-08-28 16:00:18

标签: java c# jquery

我知道这可能是一个简单的问题,但我一直在寻找一种方法来删除按钮单击上的文本框,我用这行代码添加文本框。

 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' />"          
  } 

这可能是错误的做法,但它对我有用。如果再次点击相同的按钮,有没有办法让它删除元素?

非常感谢任何帮助

2 个答案:

答案 0 :(得分:0)

您的问题标有“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; 
    }

}

上述内容并未删除不间断的空格。

答案 1 :(得分:0)

在文本框中放置一个类,例如class =“HideTheseTextBoxes”

使用jQuery隐藏onclick事件上的那些

$( ".HideTheseTextBoxes" ).hide();