草庐IT

jquery - 卡住第一列和细节

coder 2023-08-12 原文

我有一个表格，我需要能够粘贴第一列和与之相关的详细信息。单元格需要能够垂直增长以显示隐藏列表，并且子 div 绝对位于它旁边。为了达到这种效果，我相对定位了表格单元格。行为可以在这里看到:

http://jsfiddle.net/vmo28zz4/1/ 

.headcol {
    position: relative;
    background-color:white;
}

这样一来，我就无法像在其他示例中那样绝对定位单元格。如果有另一种方法可以实现我的扩展器/细节的预期效果，我也会对此持开放态度。谢谢。

最佳答案

添加这些样式:

.content tr::before {
  content: '';
  display: block;
}

.content td:first-child {
  position: absolute;
}

改变 updateDetailWidths() 如下:

function updateDetailWidths() {
  var mw= 0;
  $('.content td:first-child')
    .each(function() {
      mw= Math.max(mw, $(this).width());
      $(this).parent().height($(this).height());
    })
    .width(mw);
  $('<style>.content tr::before{width:'+mw+'px}</style>').appendTo('head');
  $('.headcol-detail').width($('.content').innerWidth()-mw);
}

在点击处理程序的末尾添加以下代码:

$('td > div:first-child').click(function () {
  ...
  var tr= $(this).closest('tr');
  tr.height($('td:first', tr).height());
});

Fiddle

这会执行以下操作:

  1. 使绝对定位的第一个 td 具有相同的宽度。
  2. 将每一行设置为其第一个 td 的高度。
  3. 向每个 tr 添加伪元素，将第二个和后续 td 推到绝对定位的第一个 td 的右侧>.

关于jquery - 卡住第一列和细节，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30674018/

卡住jquerycodesection39htmlcss

有关jquery - 卡住第一列和细节的更多相关文章

  1. jquery - 我的 jquery AJAX POST 请求无需发送 Authenticity Token (Rails) - 2

    rails中是否有任何规定允许站点的所有AJAXPOST请求在没有authenticity_token的情况下通过？我有一个调用Controller方法的JqueryPOSTajax调用，但我没有在其中放置任何真实性代码，但调用成功。我的ApplicationController确实有'request_forgery_protection'并且我已经改变了config.action_controller.consider_all_requests_local在我的environments/development.rb中为false我还搜索了我的代码以确保我没有重载ajaxSend来发送

  2. jquery - 如何将 AJAX 变量从 jQuery 传递到他们的 Controller ？ - 2

    我有一个电子邮件表格。但是我正在制作一个测试电子邮件表单，用户可以在其中添加一个唯一的电子邮件，并让电子邮件测试将其发送到该特定电子邮件。为了简单起见，我决定让测试电子邮件通过ajax执行，并将整个内容粘贴到另一个电子邮件表单中。我不知道如何将变量从我的HAML发送到我的Controllernew.html.haml-form_tagadmin_email_blast_pathdoSubject%br=text_field_tag'subject',:class=>"mass_email_subject"%brBody%br=text_area_tag'message','',:nam

  3. ruby-on-rails - CarrierWave - PDF - 只选择第一页 - 2

    我的Rails应用程序中安装了carrierwave。但是，当用户上传多页pdf时，我只希望应用程序获取文档中的第一页并将其转换为jpeg。这可能吗？用什么命令？这是我的uploader。#encoding:utf-8classImageUploader[200,300]##defscale(width,height)##dosomething#end#Createdifferentversionsofyouruploadedfiles:version:thumbdoprocess:resize_to_fill=>[150,210]process:convert=>:jpgdefful

  4. ruby - 如何跳过 CSV 文件的第一行并将第二行作为标题 - 2

    有没有办法跳过CSV文件的第一行，让第二行作为标题？我有一个CSV文件，第一行是日期，第二行是标题，所以我需要能够在遍历它时跳过第一行。我尝试使用slice但它会将CSV转换为数组，我真的很想将其读取为CSV，以便我可以利用header。 最佳答案 根据您的数据，您可以使用另一种方法和skip_lines-option此示例跳过所有以#开头的行require'csv'CSV.parse(DATA.read,:col_sep=>';',:headers=>true,:skip_lines=>/^#/#Markcomments!)do|

  5. arrays - 在一行中选择数组的第一个和最后一个元素 - 2

    我的任务是从数组中选择最高和最低的数字。我想我很清楚我想做什么，但只是努力以正确的格式访问信息以满足通过标准。defhigh_and_low(numbers)array=numbers.split("").map!{|x|x.to_i}array.sort!{|a,b|ba}putsarray[0,-1]end数字可能看起来像"80917234100"，要通过，我需要输出"9234"。我正在尝试putsarray.first.last，但一直无法弄明白。 最佳答案 有Array#minmax完全满足您需要的方法:array=[80,

  6. ruby-on-rails - Ruby 或 Rails 有只将第一个字符大写的方法吗？ - 2

    或者好像我必须自己写方法？(保持DHA不变):ruby-1.9.2-p180:001>s='omega-3(DHA)'=>"omega-3(DHA)"ruby-1.9.2-p180:002>s.capitalize=>"Omega-3(dha)"ruby-1.9.2-p180:003>s.titleize=>"Omega3(Dha)"ruby-1.9.2-p180:005>s[0].upcase+s[1..-1]=>"Omega-3(DHA)" 最佳答案 如果我的回答只是垃圾，我深表歉意(我不做ruby)。但我相信我已经为您找到了答

  7. ruby - gsub 删除第一个逗号前的所有内容 - 2

    我有这个字符串:auteur="comtedeFlandreetHainaut,Baudouin,Jacques,Thierry"我想删除第一个逗号之前的所有内容，即在这种情况下保留“Baudouin,Jacques,Thierry”试过这个:nom=auteur.gsub(/.*,/,'')但这会删除最后一个逗号之前的每个逗号，只保留“Thierry”。 最佳答案 auteur.partition(",").last#=>"Baudouin,Jacques,Thierry" 关于rub

  8. ruby-on-rails - Order Hash 并删除第一个键值对 - 2

    我有一个以时间戳为键的哈希。hash={"2016-05-31T22:30:58+02:00"=>{"path"=>"/","method"=>"GET"},"2016-05-31T22:31:23+02:00"=>{"path"=>"/tour","method"=>"GET"},"2016-05-31T22:31:05+02:00"=>{"path"=>"/contact_us","method"=>"GET"}}我订购了这个系列并得到了第一双这样的:hash.sort_by{|k,_|k}.first.first但是我该如何删除它呢？删除方法requiresyou知道key的准确

  9. arrays - 字符串数组中字符串第一部分的总和 - 2

    我有一个字符串数组，我需要从中提取第一个单词，将它们转换为整数并获得它们的总和。示例:["5Apple","5Orange","15Grapes"]预期输出=>25我的尝试:["5","5","15"].map(&:to_i).sum 最佳答案 我从你的问题中找到了答案。["5Apple","5Orange","15Grapes"].map(&:to_i).sum在数组中，如果存在任何整数可转换值，那么它将自动转换为整数。 关于arrays-字符串数组中字符串第一部分的总和，我们在Sta

  10. ruby-on-rails - Rails 3 : Looping through array of objects, 忽略数组中的第一个对象？ - 2

    在我看来，我正在尝试显示一个对象表，这是我的代码:CategoriesCBB's">然而这是抛出一个错误说:can'tconvertCapabilityBuildingBlockintoArray关系是正确的，错误来self尝试在此处减去数组的第一个对象的行:有什么方法可以忽略数组中的第一个对象来遍历数组吗？谢谢 最佳答案 尝试使用Array.drop-http://www.ruby-doc.org/core/classes/Array.html#M000294 关于ruby-on-ra

随机推荐