Table中定义列宽度为*时候问题修正

在表格中,若指定部分列的宽度绝对值,某些列使用*来自动调整,若列的宽度绝对值之和大于表格的宽度时候,会导致*列的显示异常。

本脚本修正以上显示方式。

/**
 * @copyright vaalhaai.org
 *
 * <pre>
 * vaalhaai table css amendment
 * base on jQuery 1.3.2
 *
 * @author: Jimmy.Shine <Jimmy.Shine@Gmail.com>
 * @version: 1.0
 * @date : Nov 30,2009
 * @description: If the table-layout is fixed,if the table width is less than the sum of col widths,
 * 				the define of col='*' will had no width,so we set a	fixed width='?' instead of it.
 * @testFor: IE 7,8; Firefox 3.5; Opera10.10; Safari 4
 * </pre>
 */
(function($){
    // Define object
    $.fn.tableCssAmendment = function(options){
        // jquery extend to define default settings.
        this.settings = $.extend({
            starColWidth: 100
        }, options || {});

		if(isNaN(this.settings.starColWidth)){
			alert("Member starColWidth must typeof Number");
			return;
		}
        reTable = $(this).filter("table");
        
        var colsWidth = 0;
        var colStarCount = 0;
        var cols = reTable.children("colgroup").children("col").each(function(index){
            if ($(this).attr("width") == "*" || $(this).attr("width") == "" || $(this).attr("vaalhaai_rewidth")) {
                colStarCount++;
            }
            else {
                colsWidth += parseInt($(this).attr("width"));
            }
        });
        if (colStarCount > 0) {
            var percent = 100 / colStarCount;
            reTable.children("colgroup").children("col").each(function(index){
                if ($(this).attr("width") == "*" || $(this).attr("width") == "" || $(this).attr("vaalhaai_rewidth")) {
                    $(this).attr("width", percent + "%").attr("vaalhaai_rewidth", true);
                }
            });
        }
		
		if (colsWidth >= reTable.parent().width()) {
            reTable.width(reTable.width() + colStarCount * this.settings.starColWidth);
        }
        else {
            reTable.width(reTable.width());
        }
        return this;
    }; 
})(jQuery);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值