如何触发time-table区块中与点击的list-events区块文本完全一致的div点击事件（优先使用jQuery）

嘿，这个联动需求用jQuery实现起来很简单，我给你两种方案，一种是直接匹配文本内容，另一种是利用唯一ID来精准匹配（更推荐后者，因为ID不会变）。

方案一：匹配完整文本内容 #

这种方案适合文本完全一致的场景，代码逻辑很直观：

1. 给#list-events里的所有.jqtl-event-node绑定点击事件（用事件委托兼容动态生成的元素）
2. 获取点击元素的文本内容，去掉首尾空白避免匹配误差
3. 在#time-table里筛选出文本内容一致的.fc-title元素
4. 触发该元素的点击事件

// 事件委托绑定，支持动态新增的列表项
$('#list-events').on('click', '.jqtl-event-node', function() {
    // 获取当前点击元素的文本，trim()去除首尾空格/换行
    const clickedText = $(this).text().trim();
    
    // 筛选出时间表中文本匹配的元素
    const targetElement = $('#time-table .fc-title').filter(function() {
        return $(this).text().trim() === clickedText;
    });
    
    // 如果找到匹配元素，触发点击事件
    if (targetElement.length > 0) {
        targetElement.trigger('click');
    }
});

方案二：利用唯一ID精准匹配（更推荐） #

从你的示例里看到每个事件都有唯一ID（比如ID 4178），用这个ID来匹配会更可靠——就算文本里的其他内容（比如司机名字）有变化，ID始终是唯一的，不会影响匹配结果：

$('#list-events').on('click', '.jqtl-event-node', function() {
    // 从点击元素的文本中提取唯一ID
    const eventIdMatch = $(this).text().match(/ID (\d+)/);
    if (!eventIdMatch) return; // 如果没找到ID，直接退出
    
    const eventId = eventIdMatch[1];
    
    // 筛选出时间表中包含对应ID的元素
    const targetElement = $('#time-table .fc-title').filter(function() {
        return $(this).text().includes(`ID ${eventId}`);
    });
    
    // 触发点击事件
    if (targetElement.length > 0) {
        targetElement.trigger('click');
    }
});

注意事项 #

• 用事件委托（$('#list-events').on('click', '.jqtl-event-node', ...)）而不是直接给每个.jqtl-event-node绑定事件，这样即使后续通过JS动态新增列表项，点击事件依然有效。
• trim()很重要！HTML里的空白字符（空格、换行）很容易导致文本匹配失败，一定要去掉首尾空白。
• 如果你的.fc-title元素本身已经绑定了点击事件，trigger('click')会直接触发它的原有逻辑，不需要额外修改。

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