Question

我有这样的代码：

if (tmp_loket==0) {
    for (var i = 1; i<= data['jumlah_loket']; i++) {
        loket = '<div class="col-md-3" style="width: 32%;">'+
            '<div class="'+ i +
                    ' jumbotron" style="padding: 0px;">'+
                '<button class="btn btn-danger" type="button" style="width: 100%;">'+ if(i==1){ 'UMUM' } +'</button>'+
                '<h1> '+data["init_counter"][i]+' </h1>'+
                '<button class="btn btn-danger" type="button" style="width: 100%;"><span class="glyphicon glyphicon-credit-card">&nbsp;</span>LOKET '+ i +'</button>'+
                '</div>'+
            '</div>';
        $(".loket").append(loket);
    }

    tmp_loket = data['jumlah_loket'];
}

我想要执行循环时，值i = 1然后出现的是"UMUM"，当值i = 2时然后出现的是"ANAK"。

但是如何转义单引号并执行（如果）逻辑？

这里是问题：

'<button class="btn btn-danger" type="button" style="width: 100%;">'+ if(i==1){ 'UMUM' } +'</button>'+

谢谢。

Answer 1

使用三元?:运算符：

..... + (i === 1 ? 'UMUM' : 'ANAK') + .....

Answer 2

您可以使用template literals，并且正如Nick Parsons所说的那样，使用数组代替if语句：

const words = ['UMUM', 'ANAK'];
let tmp_loket = 0;
let data = {jumlah_loket:2, init_counter:[4,5,6,7,8]};

if (tmp_loket==0) {
                for (var i = 1; i<= data['jumlah_loket']; i++) {
                    loket = `<div class="col-md-3" style="width: 32%;">
                                <div class="${i} jumbotron" style="padding: 0px;">
                                    <button class="btn btn-danger" type="button" style="width: 100%;">${words[i-1]}</button>
                                    <h1> ${data["init_counter"][i]} </h1>
                                    <button class="btn btn-danger" type="button" style="width: 100%;"><span class="glyphicon glyphicon-credit-card">&nbsp;</span>LOKET ${i}</button>
                                </div>
                            </div>`;
                    $(".loket").append(loket);
                }

                tmp_loket = data['jumlah_loket'];
            }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="loket"></div>

Answer 3

您可以这样做：

var string = '<button class="btn btn-danger" type="button" style="width: 100%;">';
if(i == 1){
 var string = string + 'UMUM</button>';
}
else if(i == 2){
 var string = string + 'ANAK</button>';
}

如何转义字符串并在JavaScript中执行一些（如果）逻辑？

3 个答案: