jquery - 如何更改附加表行的文本区域高度大于上一行?

标签 jquery html css

我这里有一个 jsfiddle:http://jsfiddle.net/XM8hG/33/embedded/result/

要查看 fiddle 的代码,请单击此处:http://jsfiddle.net/XM8hG/33/

要使用 fiddle ,请按照以下步骤操作:

  1. 在顶部单击打开的网格并选择按钮 3,然后单击“添加问题”按钮将行追加到下面的表格中,您可以看到文本区域填满了表格单元格。

  2. 现在回到顶部,再次单击打开网格,但这次选择按钮 26,然后单击“添加问题”按钮将行附加到下面的表格中,您可以看到文本区域未填充表格细胞。这是因为它占用了更多的空间并且表格单元格增加了。

现在,如果您刷新 fiddle 并反转步骤,那么您先执行第 2 步,然后执行第 1 步,您将看到两个表格单元格中的文本区域填充行,因为第一个表格行比第二个表格行大。

但是我需要在下面的代码中包含什么才能实现反向解决方案,以便如果最后一个表格行较小,那么如果行是,textarea 应该能够填充下一行中的表格单元格更大?

下面是在 fiddle 中注释的主要代码,以便在选项更改时将文本区域填充到表格单元格:

//CHANGE TEXTAREA HEIGHT
    var _x = $(e.currentTarget);
    var _y = _x.closest('td.extratd');
    var _z = _y.prev();

    $('textarea', _z).css('height', '').height(_z.innerHeight())

最佳答案

将您的 setWidth() 函数更新为

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

    });
  }

参见http://jsfiddle.net/XM8hG/34/

关于jquery - 如何更改附加表行的文本区域高度大于上一行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14126347/

相关文章:

jquery - 如何使用 jQuery 更改多个元素的字体大小

javascript - 检查是否加载了 jQuery UI

javascript - Jquery切换: closing a toggle element

javascript - 仅在视频播放时进行视频控制 (html5)

javascript - 本地存在字体时忽略谷歌字体加载

javascript - 下拉选项未填充 JSON

html - CSS 布局难题

jquery - Accordion 式脚本的奇怪故障

javascript - 如何使用类名将常规 JSS 类与 Material-UI 的类覆盖功能结合起来

css - 围绕中心 Logo 图像进行居中导航