Genexus中如何获取prompt弹窗信息并打印显示到屏幕上

核心逻辑：浏览器原生prompt()弹窗被调用后，会直接返回用户在输入框中填写的内容，你只需要接收这个返回值，就可以完成打印、页面渲染的操作，分两种场景处理：

• 场景1：你可以直接修改页面按钮的点击逻辑
  直接在箭头按钮的点击事件回调中，接收prompt的返回值做后续处理即可，参考代码：

  // 选中页面上的箭头按钮
  const arrowButton = document.querySelector('替换成你页面里箭头按钮对应的CSS选择器')
  
  arrowButton.addEventListener('click', () => {
    // 弹出prompt弹窗，接收用户输入：第一个参数是弹窗提示文案，第二个是输入框默认值
    const inputContent = prompt('请输入内容', '')
  
    // 用户点击弹窗「取消」按钮时，prompt会返回null，需要做判断避免异常
    if (inputContent !== null) {
      // 方式1：打印到浏览器控制台
      console.log('prompt中获取到的内容：', inputContent)
      // 方式2：显示到页面指定位置，替换成你自己的内容容器选择器
      const contentShowArea = document.querySelector('替换成页面上用来展示内容的元素选择器')
      contentShowArea.textContent = `从prompt获取到的输入：${inputContent}`
    }
  })
  

• 场景2：prompt是第三方/原有封装逻辑触发，你无法直接修改原有点击代码
  可以通过重写全局window.prompt方法拦截输入内容，不会影响原有页面逻辑，参考代码：

  // 先缓存浏览器原生的prompt方法
  const nativePrompt = window.prompt
  
  // 重写全局prompt方法
  window.prompt = function(...args) {
    // 调用原生prompt拿到用户输入的内容
    const result = nativePrompt.apply(this, args)
    
    // 在这里处理拿到的内容
    if (result !== null) {
      console.log('拦截到的prompt输入：', result)
      const contentShowArea = document.querySelector('替换成页面上用来展示内容的元素选择器')
      contentShowArea.textContent = `从prompt获取到的输入：${result}`
    }
  
    // 将结果原样返回，保证原有页面逻辑不受影响
    return result
  }
  

注意：如果弹出的输入弹窗是前端用div模拟的自定义模态框、不是原生window.prompt()弹窗，上述方法不生效。这种情况你只需要监听弹窗的确认按钮点击事件，读取弹窗内输入框DOM的value属性，就能拿到用户输入的内容。

相关界面参考 #

• Web Panel 界面：
  
• 点击箭头弹出的prompt弹窗效果：
  

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