Question

我有一张这样的表

<body>
<div id="content">
<div>
<div style="float:left">
<table border="1" cellspacing="0" cellpadding="0" id="tbl" style="width:850px">
<thead>
<tr>
<th>Select</th>
<th><span id="span_label">Label</span></th>
<th><span id="span_id">ID</span></th>
<th><span id="span_type">Type</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class="center" id="sensor_pdu0"><input type="radio" name="sensorrd" value="07000000FCB74226"/></td>
<td id="sensor_pdu0" style="width:250px" >07000000FCB74226&nbsp;</td>
<td id="sensor_pdu0" style="width:250px" >SNSR: 1-1</td>
<td class="left" id="sensor_pdu0" style="width:250px" >zy</td>
</tr>
<tr>
<td class="center" id="sensor_pdu1"><input type="radio" name="sensorrd" value="380000000DDF3920"/></td>
<td id="sensor_pdu1" style="width:250px" >aaaaaaaaaa</td>
<td id="sensor_pdu1" style="width:250px" >SNSR: 1-2</td>
<td class="left" id="sensor_pdu1" style="width:250px" >be</td>
</tr>
<tr>
<td class="center" id="sensor_pdu2"><input type="radio" name="sensorrd" value="E200000004D2CE42"/></td>
<td id="sensor_id" style="width:250px" >E200000004D2CE42&nbsp;</td>
<td id="sensor_pdu2" style="width:250px" >SNSR: 1-3</td>
<td class="left" id="sensor_pdu2" style="width:250px" >e</td>
</tr>
<tr>
<td class="center" id="sensor_pdu3"><input type="radio" name="sensorrd" value="F900000003746C42"/></td>
<td id="sensor_id" style="width:250px" >F900000003746C42&nbsp;</td>
<td id="sensor_pdu3" style="width:250px" >SNSR: 1-4</td>
<td class="left" id="sensor_pdu3" style="width:250px" >c</td>
</tr>
<tr>
<td class="center" id="sensor_pdu4"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
<tr>
<td class="center" id="sensor_pdu5"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
<tr>
<td class="center" id="sensor_pdu6"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
<tr>
<td class="center" id="sensor_pdu7"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
<tr>
<td class="center" id="sensor_pdu8"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
<tr>
<td class="center" id="sensor_pdu9"   style="width:250px" ><input type="radio" name="sensorrd" value=""/></td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
<td style="width:250px" >&nbsp;</td>
</tr>
</tbody>
</table>
</div>
<div style="left:870px;padding-top:1px">
<table border="1" cellspacing="0" cellpadding="0" id="btnbox" style="width:150px">
<thead>
<tr>
<th>&nbsp;</th>
</tr>
</thead>
<tbody>
<tr>
<td class="center" valign="middle">
<br/>
<br/>
<button title="Up" onclick="moveupdown('up')"/>
<br/>
<br/>
<span>Move Selected Sensors</span>
<br/>
<br/>
<button title="Down" onclick="moveupdown('down')"/>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>

有两个按钮名称为“UP”和“Down”。当您选择一个单选框并单击“向上”/“向下”按钮时，所选行将向上/向下移动。像这样的按钮的功能

function moveupdown(arg){
var rd =  $('input:radio[name="sensorrd"]:checked');
var row = rd.parents("tr:first");
if (arg=="up") {
row.insertBefore(row.prev());
} else if (arg=="down") {
row.insertAfter(row.next());
}
}

小提琴：http://jsfiddle.net/27jcwps7/

问题在于它经常显示一个带有无线电盒标签的空白页面（例如：aaaaaa，bbbbbb或cccccc）。任何人都可以帮我解决这个问题 enter image description here

Jquery“insertbefore / insertafter”会导致空白页面

0 个答案: