如何使tbody儿童的大小与thead之后创建的第一个tbody相同
嗨我有这个问题。 我想问一下如何使tbody儿童的体型与thead后第一排的体型相同？
这里我的代码.. 请帮帮我..你可以编辑我的小提琴或给出答案
＆＃13;
＆＃13;
＆＃13;
＆＃13;
var theadFlag = 0;
var thdeadData = "";
$(document).on('click','#input_check',function(e){
e.preventDefault();
if(theadFlag == 0) { theadData ='<tr>'
+'<th>Nama Karyawan</th>'
+'<th>Tanggal</th>'
+'<th>Cost Center</th>'
+'<th>Jam Mulai</th>'
+'<th>Jam Selesai</th>'
+'<th>Status Lembur</th>'
+'<th>Total Jam</th>'
+'<th>Tugas</th>'
+'</tr>'
}
else
{
theadData = ""
}
var nama = $('input[id="nama_check"]').val(),
bagian = $('input[id="tanggal_check"]').val(),
cost = $('input[id="cost_check"]').val(),
mulai = $('input[id="start"]').val(),
selesai = $('input[id="end"]').val(),
status = $('input[id="status_check"]').val();
total = $('input[id="total_jam"]').val(),
tugas = $('input[id="tugas_check"]').val(),
$('tbody #body').append('<table id="check_data">'
+ theadData
+'<tr>'
+'<td>'+$("#nama_check").val()+'</td>'
+'<td>'+$("#tanggal_check").val()+'</td>'
+'<td>'+$("#cost_check").val()+'</td>'
+'<td>'+$("#start").val()+'</td>'
+'<td>'+$("#end").val()+'</td>'
+'<td>'+$("#status_check").val()+'</td>'
+'<td>'+$("#total_jam").val()+'</td>'
+'<td>'+$("#tugas_check").val()+'</td>'
+'</tr>'
+ '</table>');
theadFlag = 1;
}); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<!-- The Modal -->
<div id="myMd4" class="md4">
<!-- Modal content -->
<div class="md4-content" style="margin-top:20px">
<div id="data">
<table border="1" style="margin-left:50px">
<tr>
<td>
<table border="1">
<tr>
<td>
<form action="../php/absen/absen_karyawan_autocomplete.php" id="form_check" method="post" name="form_check">
<table>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Nama Karyawan</td>
<td width="10">:</td>
<td width="150"><input type="text" id="nama_check" type="text" name="nama_check" size="25" style="float:left; text-transform:uppercase"> </td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Tanggal</td>
<td width="10">:</td>
<td width="150"><input type="text" id="tanggal_check" type="text" name="tanggal_check" size="25" style="float:left; text-transform:uppercase"></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Jam Mulai</td>
<td width="10">:</td>
<td><input type="time" id="start" name="logintime" style="float:left"/></td>
<td width="100" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Jam Selesai</td>
<td width="10">:</td>
<td width="150"><input type="time" id="end" name="logouttime" style="float:left"/></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Status Lembur</td>
<td width="10">:</td>
<td width="150"><select name="option2" id="option2" onchange="Choose1(this)" style="float:left">
<option value="-">-</option>
<option value="istirahat">istirahat</option>
<option value="tanpa istirahat">tanpa istirahat</option>
</select><input type="text" name="status_check" size="8" readonly="readonly" id="status_check" style="text-transform:uppercase" /></td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Total Jam</td>
<td width="10">:</td>
<td width="150"><input type="text" id="total_jam" type="text" name="total_jam" size="25" style="float:left; text-transform:uppercase" ></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Cost Center</td>
<td width="10">:</td>
<td width="150"><input type="text" id="cost_check" type="text" name="cost_check" size="25" style="float:left; text-transform:uppercase" ></td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Tugas</td>
<td width="10">:</td>
<td width="150"><input type="text" id="tugas_check" type="text" name="tugas_check" size="25" style="float:left" ></td>
</tr>
</table>
</form>
</td>
<td width="300">
<label class="button" name="input_check" id="input_check" style="height:35px; width:40px" />CLICK HERE</label>
<label class="button" name="edit_karyawan" id="edit_karyawan" style="height:35px; width:40px" />b</label>
<label class="button" name="delete_karyawan" id="delete_karyawan" style="height:35px; width:40px; " />c</label>
<label name="tutup" id="tutup" class="tutup" style="height:35px; width:40px;"/>d</label>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<p align="center"><strong>Test</strong></p>
<table id="check_data" class="check_data" style="font-size:12px; margin-left:70px ">
<tbody id="body">
</tbody>
</table>
</td></tr></table>
</div>
</div>
</div>
<script>
function Choose1(data) {
document.getElementById ("status_check").value = data.value;
}
</script>
1 个答案:
答案 0 :(得分：0)
你有几个无效的html标签关闭。我这样做的正确方法是追加tr而不是整个table。
＆＃13;
＆＃13;
＆＃13;
＆＃13;
var theadFlag = 0;
var thdeadData = "";
$(document).on('click', '#input_check', function(e) {
e.preventDefault();
if (theadFlag == 0) {
theadData = '<tr>' +
'<th>Nama Karyawan</th>' +
'<th>Tanggal</th>' +
'<th>Cost Center</th>' +
'<th>Jam Mulai</th>' +
'<th>Jam Selesai</th>' +
'<th>Status Lembur</th>' +
'<th>Total Jam</th>' +
'<th>Tugas</th>' +
'</tr>';
$('#body').append(theadData)
}
var nama = $('input[id="nama_check"]').val(),
bagian = $('input[id="tanggal_check"]').val(),
cost = $('input[id="cost_check"]').val(),
mulai = $('input[id="start"]').val(),
selesai = $('input[id="end"]').val(),
status = $('input[id="status_check"]').val();
total = $('input[id="total_jam"]').val(),
tugas = $('input[id="tugas_check"]').val(),
$('#body').append(
'<tr>' +
'<td>' + $("#nama_check").val() + '</td>' +
'<td>' + $("#tanggal_check").val() + '</td>' +
'<td>' + $("#cost_check").val() + '</td>' +
'<td>' + $("#start").val() + '</td>' +
'<td>' + $("#end").val() + '</td>' +
'<td>' + $("#status_check").val() + '</td>' +
'<td>' + $("#total_jam").val() + '</td>' +
'<td>' + $("#tugas_check").val() + '</td>' +
'</tr>');
theadFlag = 1;
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<!-- The Modal -->
<div id="myMd4" class="md4">
<!-- Modal content -->
<div class="md4-content" style="margin-top:20px">
<div id="data">
<table border="1" style="margin-left:50px">
<tr>
<td>
<table border="1">
<tr>
<td>
<form action="../php/absen/absen_karyawan_autocomplete.php" id="form_check" method="post" name="form_check">
<table>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Nama Karyawan</td>
<td width="10">:</td>
<td width="150"><input type="text" id="nama_check" type="text" name="nama_check" size="25" style="float:left; text-transform:uppercase"> </td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Tanggal</td>
<td width="10">:</td>
<td width="150"><input type="text" id="tanggal_check" type="text" name="tanggal_check" size="25" style="float:left; text-transform:uppercase"></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Jam Mulai</td>
<td width="10">:</td>
<td><input type="time" id="start" name="logintime" style="float:left" /></td>
<td width="100" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Jam Selesai</td>
<td width="10">:</td>
<td width="150"><input type="time" id="end" name="logouttime" style="float:left" /></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Status Lembur</td>
<td width="10">:</td>
<td width="150"><select name="option2" id="option2" onchange="Choose1(this)" style="float:left">
<option value="-">-</option>
<option value="istirahat">istirahat</option>
<option value="tanpa istirahat">tanpa istirahat</option>
</select><input type="text" name="status_check" size="8" readonly="readonly" id="status_check" style="text-transform:uppercase" /></td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Total Jam</td>
<td width="10">:</td>
<td width="150"><input type="text" id="total_jam" type="text" name="total_jam" size="25" style="float:left; text-transform:uppercase"></td>
</tr>
<tr>
<td width="50" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Cost Center</td>
<td width="10">:</td>
<td width="150"><input type="text" id="cost_check" type="text" name="cost_check" size="25" style="float:left; text-transform:uppercase"></td>
<td width="10" style="border-left:hidden; border-right:hidden"></td>
<td width="150">Tugas</td>
<td width="10">:</td>
<td width="150"><input type="text" id="tugas_check" type="text" name="tugas_check" size="25" style="float:left"></td>
</tr>
</table>
</form>
</td>
<td width="300">
<label class="button" name="input_check" id="input_check" style="height:35px; width:40px">CLICK HERE</label>
<label class="button" name="edit_karyawan" id="edit_karyawan" style="height:35px; width:40px">b</label>
<label class="button" name="delete_karyawan" id="delete_karyawan" style="height:35px; width:40px; ">c</label>
<label name="tutup" id="tutup" class="tutup" style="height:35px; width:40px;">d</label>
</td>
</tr>
<tr>
<td>
<p align="center"><strong>Test</strong></p>
<table id="check_data" class="check_data" style="font-size:12px; margin-left:70px ">
<tbody id="body">
</tbody>
</table>
<script>
function Choose1(data) {
document.getElementById("status_check").value = data.value;
}
</script>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？