JQUery:根据 AJAX 响应选中或取消选中复选框

Question

我正在为个人元素从头开始构建一个管理面板，我希望它完成的任务之一是在表格中显示数据，为了获取这些数据，我使用 AJAX 和 JQuery 从服务器获取数据并在前端填充表格。

此数据有一个 isVisible bool 字段(可以是 0 或 1)，我遇到的问题是我想在填充行时选中或取消选中复选框，具体取决于 isVisible 字段是真还是假。

这是我的 JQuery 代码:

success: function(data) {
				
				console.log(data);
					
					    $('.row[data-link=' + linked_entry + ']').remove();
					
					    $.each(data, function (index, item) {
					
					        var sliders_row = '<tr class="row" data-link="sliders">';
                            /*sliders_row += '<td>' + this.id + '</td>';*/
                            sliders_row += '<td>' + this.title + '</td>';
                            sliders_row += '<td>' + this.body + '</td>';
                            sliders_row += '<td>' + this.image + '</td>';
                            sliders_row += '<td style="text-align:center;"><input type="checkbox" name="isVisible" value="" checked></td>';
                            sliders_row += '<td class="entry_table_options_container">';
                            sliders_row += '<i class="fa fas fa-pencil-alt form_show_edit" data-link="sliders" data-id="'+ this.id + '" data-title="'+ this.title +'" data-body="'+ this.body +'" data-image="'+ this.image +'" data-isVisible="'+ this.isVisible +'"title="Editar" title="Editar" style="background-color:#5BC0DE;"></i>';
                            sliders_row += '</td>';
                            sliders_row += '</tr>';
	
					        $('.entry_table_container[data-link=' + linked_entry + ']').append(sliders_row);
                        });
                        
},

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

有没有一种方法可以即时执行此操作，而无需创建两个不同的 html 模板来附加到成功函数中？

Answer 1

按以下步骤操作。

sliders_row += '<td style="text-align:center;"><input type="checkbox" name="isVisible" '+(this.isVisible ? 'checked' : '')+'></td>';

这是一个例子

var isVisible = true;
$(document).ready(function(){
  $("#abc").html('<input type="checkbox" name="isVisible" value="" '+(isVisible ? 'checked' : '')+'>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="abc"></div>