Question

我正在动态地将Style添加到名为 ordernow

的动态创建按钮中

根据状态字段，我为按钮添加了一种样式

根据要求

如果状态为1，则该类应为

btn-success

如果状态为0，则类必须为

btn-mrn

我试过这种方式

for (var i = 0; i < response.length; i++) {
    var classstyle  = "";

    if(response[i].status==1) {
        classstyle = "success";
    } else {
        classstyle = "mrn";
    }

    var $ordernow= $('<input/>').attr({ type: 'button',name:'btn1', class:'btn btn-'+classstyle+'', value:'Order Now', style: 'float:right'});
    divhtml.append('<li><h6>' + response[i].area + '</h6><p>' + response[i].address + '</p></li>');

}

但我观察到，无论最后一种风格是否存在，都会被添加到所有按钮

http://jsfiddle.net/nvx4tkLt/5/

有人可以帮忙解决这个问题吗

Answer 1

正如我在评论中所说，你在循环之外添加$ordernow，所以你只需要在循环中添加最后一次迭代中构造的按钮。要修复它，请尝试：

for (var i = 0; i < response.length; i++) {

    var classstyle = "";
    if (response[i].status == 1) {
        classstyle = "success";
    } else {
        classstyle = "mrn";
    }

    var $ordernow = $('<input/>').attr({
        type: 'button',
        name: 'btn1',
        class: 'btn btn-' + classstyle + '',
        value: 'Order Now',
        style: 'float:right'
    });

    divhtml.append('<li><h6>' + response[i].area + '</h6><p>' + response[i].address + 
       '</p></li>').append($ordernow);  // <-- note we are appending inside the loop now
}

请参阅：http://jsfiddle.net/nvx4tkLt/4/

无法正确地为动态创建的按钮添加样式

1 个答案: