我明白你想要实现的效果——点击表格单元格进入编辑模式时，自动清空原有内容，不用手动删除就能直接输入新值。之前尝试的onfocus和修改textContent没用，是因为jQuery Tabledit的工作机制和你想的不一样：

默认状态下，表格里显示的是<span class="tabledit-span">，而真正用来编辑的<input>是隐藏的。当你点击单元格进入编辑模式时，插件会隐藏span、显示input，这时候真正需要操作的是这个动态生成的input，而不是td本身。

下面给你两个可行的解决方案：

方案一：利用Tabledit的编辑回调函数 #

在初始化Tabledit的时候，使用onEdit回调，当进入编辑模式时直接清空对应input的值：

// 替换成你的表格ID
$('#your-crud-table').Tabledit({
  // 这里是你的现有配置，比如url、columns等
  url: '/your-crud-api',
  columns: {
    identifier: [0, 'id'],
    editable: [[1, 'payment_company'], [2, 'other_column']]
  },
  // 添加onEdit回调
  onEdit: function(event, editableData, submitButton) {
    // 找到当前编辑单元格里的input
    const editInput = $(editableData.target).find('.tabledit-input');
    // 清空input值
    editInput.val('');
  }
});

这个方法的好处是和Tabledit的生命周期绑定，触发时机准确。

方案二：给动态生成的input绑定焦点事件 #

因为Tabledit的input是动态生成的，所以需要用事件委托来绑定focus事件，确保新生成的input也能触发：

// 绑定到表格上，监听所有tabledit-input的focus事件
$('#your-crud-table').on('focus', '.tabledit-input', function() {
  // 清空当前input的值
  $(this).val('');
});

如果只想针对特定列（比如payment_company列）生效，可以给该列的td加标识，比如生成td时：

<td class="payment-company-col"><?php echo $row['payment_company']; ?></td>

然后修改事件选择器：

$('#your-crud-table').on('focus', '.payment-company-col .tabledit-input', function() {
  $(this).val('');
});

为什么之前的方法失效？ #

• <td>本身不是可聚焦元素（除非设置tabindex），所以onfocus事件根本不会触发；
• 修改td.textContent只会改变显示用的span内容，不会影响真正用来提交的input值；
• 你看到的开发者工具里的代码，是插件切换到编辑模式后的动态DOM，直接写在静态td上的事件会被插件的动态生成逻辑覆盖。

内容的提问来源于stack exchange，提问作者AdrianB