11.0.2 文本框获取焦点时调用显示行，失去焦点时隐藏行

登录

本帖最后由福星于 2025-5-23 16:59 编辑

首先在页面加载时用了js命令，文本框获取焦点时调用显示行命令，失去焦点时隐藏行。
现在的问题是    在图文列表做的点击命令无法生效，是不是被隐藏了所以无法生效？

代码分享给大家

(function() {
// 定义选择器常量
const INPUT_SELECTOR = "[fgcname='search'] .fgc-inputbox";

// 焦点处理函数
function handleFocus() {
      Forguncy.CommandHelper.executeCellCommand("expand");
}
// 失焦处理函数
function handleBlur() {
      Forguncy.CommandHelper.executeCellCommand("hide");
}
// 初始化
document.addEventListener('DOMContentLoaded', function() {
      const input = document.querySelector(INPUT_SELECTOR);
      if (input) {
         // 绑定事件
         input.addEventListener('focus', handleFocus);
         input.addEventListener('blur', handleBlur);
         // 自动聚焦（可选）
         // input.focus();
      }
});
//动态元素支持（可选）
document.body.addEventListener('focus', function(e) {
      if (e.target.matches(INPUT_SELECTOR)) {
         handleFocus(e);
      }
}, true);
document.body.addEventListener('blur', function(e) {
      if (e.target.matches(INPUT_SELECTOR)) {
         handleBlur(e);
      }
}, true);
})();

Simon.Sun · Simon.Sun

您好，原因在于，我们 input 表单获取焦点时，会显示隐藏的图文列表，图文列表点击时，input 也失去了焦点，触发了失去焦点命令，导致图文列表被隐藏，图文列表点击命令没能触发。

解决方案。
添加标识，在鼠标焦点在图文列表区域时，不要触发隐藏逻辑，修改后的 demo 如下：

		自动登录	找回密码
密码			立即注册

[已处理] 11.0.2 文本框获取焦点时调用显示行，失去焦点时隐藏行

最佳答案

1 个回复

时代开发者征文活动

Wyn高级认证

Wyn认证

活字格认证

活字格高级认证