Question

在单击并拖动时，我需要设置表格标题的最大宽度。

我尝试了CSS中的最大宽度和宽度。

dotnet new console -lang F# -o src/App

但是没有用。这是我的代码的链接：

https://codepen.io/jasongardner/pen/QNOXym

我需要固定宽度以将桌子拖动一定距离。

Answer 1

我已解决您的问题。将您的Java脚本更改为此：

$(function() {
    var startX,
         startWidth,
         $handle,
         $table,
         pressed = false;

    $(document).on({
        mousemove: function(event) {
            if (pressed) {
                var newWidth = startWidth + (event.pageX - startX);
                if (newWidth > 300) {
                    $handle.width(300);
                } else {
                $handle.width(startWidth + (event.pageX - startX));
                }
            }
        },
        mouseup: function() {
            if (pressed) {
                $table.removeClass('resizing');
                pressed = false;
            }
        }
    }).on('mousedown', '.table-resizable th', function(event) {
        $handle = $(this);
        pressed = true;
        startX = event.pageX;
        startWidth = $handle.width();

        $table = $handle.closest('.table-resizable').addClass('resizing');
    }).on('dblclick', '.table-resizable thead', function() {
        // Reset column sizes on double click
        $(this).find('th[style]').css('width', '');
    });
});

这是我更改的代码：

if (pressed) {
   var newWidth = startWidth + (event.pageX - startX);
       if (newWidth > 300) {
           $handle.width(300);
       } else {
           $handle.width(startWidth + (event.pageX - startX));
       }
 }

我创建了变量“ newWidth”，并检查它是否大于300。仅当它较小时，它才设置新宽度。因此，实际上您可以将300替换为要定义为最大宽度的任何数字。

希望这会有所帮助

需要设置单击并拖动列标题的最小宽度

1 个答案: