我该如何删除动态添加的文本框

时间:2015-04-02 07:27:35

标签: jquery html css

这是我的Jquery代码

  var currentItem=1;
      $('.industry_button').click(function(){
          currentItem=currentItem+1;
          var strToAdd = "<div class='row' style='margin-top:8px; display:none;'><div class='delrow_industry'><span class='glyphicon glyphicon-remove-circle'></span></div><div class='col-sm-6 col-md-3 col-md-offset-2' style='margin-left: 17.5%;'><input type='text' name='domain[]" +currentItem+ "' placeholder='Industry/Domain' class='industry_text form-control'></div><label class='checkbox-inline'><input type='checkbox' name='domainExclude" +currentItem+ "' value='1'>Exclude</label></div><br>";
          $('#industry').append(strToAdd);  
      })

删除文本框的代码:

$('.delrow_industry').click(function(){
        $(this).parent().remove('rd');
    })

3 个答案:

答案 0 :(得分:1)

HTML

var strToAdd = "<div class='row' style='margin-top:8px; display:none;'>

你有一个display:none,这使你的div在添加时不可见。

DEMO

删除两个<br>style='margin-left: 17.5%;'以使其正常工作。

DEMO Modified

答案 1 :(得分:1)

尝试这个

    var newjobindustry=0;
$(".industryBtn").click(function(){
    newjobindustry=newjobindustry+1;
    $("#addjobIndustry").append("<div class='row rd'><div class='col-sm-2 col-md-1 col-md-offset-1'><div class='delrow'><span class='pull-left'><img src='/img/minus.png'></span></div></div><div class='col-sm-6 col-md-4 col-md-offset-1'><input type='text' name='domain[]' value='' placeholder='Industry/Domain' class='industry_text jobTextInput autocomplete col-md-12' id='industry'></div><label class='checkbox-inline'><input type='checkbox' name='domainExclude_"+newjobindustry+"' id='domainExclude_"+newjobindustry+"' class='domainExclude' value='1'/> Exclude</label></div>");
        $(":checkbox").labelauty();
        $(".labelauty-unchecked,.labelauty-checked").css("display","none");
});

答案 2 :(得分:0)

$("body").on("click",".delrow_industry", function(){
    if( currentItem > 1 ) {
            $(this).parent('#delin').remove();
            currentItem--; 
    }

    })