Question

编辑表格单元格时，用户可以选择整个单元格并删除内容，因此删除处理程序以拉伸单元格的大小（可调整大小的UI）。如何阻止这些支持元素的破坏？

在每个单元格中的示例.ui-resizable-handle中。必须防止他们的搬迁

use strict;
use warnings;

use Mojo::DOM;

my $html = <<END;
<div id="innercontent">
<h1>Download here</h1>
<a href="website.pdf"><img src="stuff"></a>
</div>
END

my $dom = Mojo::DOM->new($html);

for my $anchor ( $dom->find('div#innercontent a[href]')->each ) {
    my $href = $anchor->attr('href');
    print "$href\n" if $href =~ /\.pdf\z/i;
}

我尝试过类似的东西，但它不起作用

<table>
<caption>table title</caption>
<thead>
    <tr>
        <th>header</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td class="ui-resizable">
            <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
        </td>
        <td class="ui-resizable">
            <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
        </td>
        <td class="ui-resizable">
            <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
        </td>
        <td>
    </tr>
</tbody>

Answer 1

似乎没有事件会在删除dom元素时触发，如果你想阻止删除，只检测关键事件，并在用户按e.preventDefault()或{{1时使用backspace }}

delete

如何停止删除可编辑表格中的元素？

1 个答案: