Question

您好我在 techsubj div 中创建了一个按钮和进度条，但我可以创建多个按钮和sub div unber techsubj div ，我该怎么做才能避免这种情况< / p>

HTML

<div class="row" id="addsubj">
<div class="col-xs-6 col-md-4"><a id="newsubj" onclick="addnewsubj()" class="btn btn-info">+</a></div>
<div class="col-xs-12 col-sm-6 col-md-8">
    <div class="progress">
        <input type="text" id="subjname" class="form-control"/>
    </div>
</div>

JS

function addnewsubj(){
var a = document.getElementById("subjname").value;
if(!a==""){
    $('.techsubj').append(
    '<div class="row" id="'+ a +'">'+
        '<div class="col-xs-6 col-md-4">'+
            '<a href="#fourth" id="'+ a +'" class="btn btn-info" >'+ a +'</a>'+
        '</div>'+
        '<div class="col-xs-12 col-sm-6 col-md-8">'+
            '<div class="progress">'+
                '<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">'+
                    '<span class="sr-only">60% Complete (warning)</span>'+
                '</div>'+
            '</div>'+
        '</div>'+
    '</div>'
    );
}
else{
    alert("Text Box is empty");
}}

Answer 1

试试这个。

if( $('.row').length < 2 ){

// create dynamic div

}

Answer 2

如果条件存在，您可以再添加一个，以检查.row是否可用：

if(a!=""){

   if($('.techsubj').find('.row').length == 0){

       // put the append here

   }

}

我认为这会更好：

if(a!="" && $('.techsubj').find('.row').length == 0){

       // put the append here    
}

另外一个建议是，而不是这次检查if(!a==""){执行此操作：if(a!=""){

Answer 3

如果（a！=“”）使用适当的调节，它会被解决，没问题，我在我这边测试

Answer 4

http://jsfiddle.net/Dz73A/

function addnewsubj(){
var a = $("#subjname").val();
if( a != "" && $('.techsubj').children().length==0 ){
$('.techsubj').append(
    '<div class="row" id="'+ a +'">'+
        '<div class="col-xs-6 col-md-4">'+
            '<a href="#fourth" id="'+ a +'" class="btn btn-info" >'+ a +'</a>'+
        '</div>'+
        '<div class="col-xs-12 col-sm-6 col-md-8">'+
            '<div class="progress">'+
                '<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">'+
                    '<span class="sr-only">60% Complete (warning)</span>'+
                '</div>'+
            '</div>'+
        '</div>'+
    '</div>'
    );
}
else{
    alert("Text Box is empty");
}}

$("#add").click(addnewsubj);

如何在动态创建div时停止创建重复div

4 个答案: