2

考虑：

  $( "#scanInDialogItems tr td:nth-child( 3 )").mouseenter( function() {
     var q = $( this ).html();
     $( this ).html( "<input type='number' style='text-align:right width:50px' min='1' value='" + q + "'/>" );
  }).mouseleave( function() { 
     var q = $( this ).find( "input" ).val();
     $( this ).html( q );
  });

每当用户将鼠标悬停在表格第三列中的单元格上时，内容就会被替换为输入元素。奇迹般有效。

问题是该元素的内联样式没有正确应用。例如，框中的文本左对齐 - 默认值。也没有设置宽度。

我在较早的问题中读到动态创建的输入元素在创建时需要刷新：

样式未在动态创建的单选按钮中正确应用

所以我尝试添加这个：

     $( this ).find( "input" ).textinput( 'refresh' );

或者这个：

     $( this ).find( "input" ).textinput();

但这些都不起作用。我的目标平台是最新的 chrome。

我没有正确刷新输入吗？还是有其他问题？

4

1 回答 1

3

您错过了内联样式中 text-align 和 width 之间的分号...

$( "#scanInDialogItems tr td:nth-child( 3 )").mouseenter( function() {
    var q = $( this ).html();
    $( this ).html( "<input type='number' style='text-align:right;width:50px' min='1' value='" + q + "'/>" );
}).mouseleave( function() { 
    var q = $( this ).find( "input" ).val();
    $( this ).html( q );
});

我只是在 jsfiddle 中尝试了之前和之后，这就是它的全部错误:)

于 2012-11-05T17:02:25.673 回答