这段代码有什么问题,我在编辑内联时无法选择下拉框中的值?
我仅使用文本框完成了此操作,但在这种情况下,我想使用下拉选项并选择其值...
<table cellpadding="2" cellspacing="0" border="0" width="100%" id="tblMain" class="edit">
<tr>
<td>Edit this:</td>
<td class="edit shift<?php echo " ".$row['ctrID']?>"><?=$row['shift']?></td>
</tr>
</table>
这是js:
<script>
$(document).ready(function(){
$('td.edit').click(function(){
$('.ajax').html($('.ajax input').val());
$('.ajax').removeClass('ajax');
$(this).addClass('ajax');
// this is the part i am having a trouble with:
$(this).html('<select id="editbox" size="'+$(this).text().length+'"><?php while($row = mysql_fetch_assoc($editShift)){ ?><option value="' + $(this).text() + '"><?=$row['shiftCode']?></option><?php } ?></select>');
$('#editbox').focus();
});
$('#editbox').live('blur',function(){
$('.ajax').html($('.ajax input').val());
$('.ajax').removeClass('ajax');
});
});
$('td.edit').keydown(function(event){
arr = $(this).attr('class').split( " " );
if(event.which == 13)
{
$.ajax({type: "POST",
url: "get.php",
data: "value="+$('.ajax input').val()+"&rownum="+arr[2]+"&field="+arr[1],
success: function(data){
$('.ajax').html($('.ajax input').val());
$('.ajax').removeClass('ajax');
}});
}
});
</script>