Question

考虑：

  $( "#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 );
  });

每当用户将鼠标悬停在表格第三列的单元格上时，内容将被输入元素替换。像魅力一样。

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

我在之前的一个问题中读到，创建时需要刷新动态创建的输入元素：

Styles not getting applied properly in dynamically created radio buttons

所以我尝试添加这个：

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

或者这个：

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

但这些都不奏效。我的目标平台是最新的Chrome。

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

Answer 1

您在内联样式中错过了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 );
});

我刚试过一次＆amp;在jsfiddle之后，这就是它的错误：）

内联样式不应用于动态创建的输入

1 个答案: