0

我的控件出现问题,导致表格单元格不断增加。

我在这里有一个应用程序:应用程序

请打开应用程序并按照以下基本步骤操作:

  1. 当您打开应用程序时,单击“添加问题”按钮以附加表格行。

  2. 在您附加的行中单击“打开网格”并选择按钮“3”,然后再次打开网格并选择按钮“4”。通过选择按钮“3”和“4”保持交替,您应该能够看到控件保持略微向下移动,这意味着每次选择选项时表格都会略微增加。

现在奇怪的是我有一个包含相同代码的jsfiddle,但它在小提琴中没有这个问题,面对小提琴是我希望我的应用程序运行的确切方式:http: //jsfiddle.net /XM8hG/7/

现在我认为下面的代码会导致这个问题,因为每次用户选择一个选项时,我希望 textarea 在它的表格单元格中保持全高:

查询:

     $('.gridBtns').on('click', function()

    {

...

setWidth();

)};

function setWidth() {
    var questionCellWidth = $("#qandatbl_onthefly tbody .question").width();
    var questionCellHeight = $("#qandatbl_onthefly tbody .question").height();
    $(".textAreaQuestion").css({
        "width": (questionCellWidth - 6) + "px",
        "height": (questionCellHeight) + "px"
    });
}

现在我需要上面的代码让 textarea 在表格单元格中保持全高,但是我需要包含或更改什么才能在每次选择选项时停止表格增加?

实际上有没有一个地方我可以放置setWidth(),以便每个单元格中的每个文本区域都将为它们所在的每个表格单元格填充 hegiht,而不是单击选项?像它识别表格已经扩展,因此当它意识到表格单元格增加时它会扩展文本区域的高度以自行填充表格单元格

4

1 回答 1

1

您将 textarea 的高度设置为其父单元格的高度,如果不是更大的话,它将至少具有相同的大小。

在我的浏览器中,textarea 的边距为 2px,因此父单元格至少大 4px 以容纳 textarea 及其填充。因此,每次您调用setWidth()它时,它都会至少增加该数量。

如果您希望 textarea 始终填充单元格,则应设置表格单元格的大小并单独保留 textarea - 将其宽度和高度属性设置为100%以填充单元格。


编辑:

所以在 CSS 中:

.textAreaQuestion { ... width: 100%; height: 100%; ... }

并从事件处理程序中删除对 setWidth 的调用$('.gridBtns').on('click')

于 2012-12-31T04:11:33.413 回答