询问 AI 按钮

在网站任意位置添加一个按钮，一键即可向聊天发送问题

您可以在网站的任意位置放置按钮或链接——在产品旁边、价格表中或常见问题里——点击即可打开聊天并立即代访客提出问题。一键发送消息，AI 随即回复，访客无需打字即可获得答案。

提示： 非常适合价格表、常见问题和产品页面——在访客常问的内容旁边放一个询问 AI 按钮。

工作原理

一旦 Asyntai 组件脚本安装在您的页面上，它会在 window.AsyntaiWidget 暴露一个全局 JavaScript API。您可以调用其方法来以编程方式控制聊天组件。

要发送问题，请使用您想发送的消息调用 window.AsyntaiWidget.ask()：

// Open the chat and send a question
window.AsyntaiWidget.ask("What are your shipping times?");

基本示例

在 HTML 的任意位置添加一个按钮，并传入它应发送的问题：

<button onclick="window.AsyntaiWidget.ask('What are your shipping times?')">
  Ask about shipping
</button>

当访客点击按钮时，聊天会打开并自动发送问题。

文本链接示例

添加一个点击时发送问题的文本链接：

<a href="#" onclick="event.preventDefault(); window.AsyntaiWidget.ask('Do you offer refunds?');">
  Ask about refunds
</a>

注意： 在锚链接上使用 event.preventDefault() 以防止点击时页面滚动到顶部。

带样式的按钮示例

创建一个更醒目的自定义样式 CTA 按钮：

<style>
  .ask-ai-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #6366f1;
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3);
  }
  .ask-ai-btn:hover {
    background: #4f46e5;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(99, 102, 241, 0.4);
  }
</style>

<button class="ask-ai-btn" onclick="window.AsyntaiWidget.ask('How does pricing work?')">
  <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
    <path d="M12 2l1.9 4.8L18.7 8l-4.8 1.9L12 14.7l-1.9-4.8L5.3 8l4.8-1.2L12 2z"/>
  </svg>
  Ask AI
</button>

自动加载

ask() 方法会在发送前等待小部件加载完成，因此即使访客在页面加载的瞬间点击也能正常工作——您无需检查小部件是否就绪。

完整 API 参考

方法	描述
`AsyntaiWidget.ask("message")`	打开聊天并发送一条消息，就像访客自己输入的一样
`AsyntaiWidget.open()`	打开聊天组件
`AsyntaiWidget.close()`	关闭聊天组件
`AsyntaiWidget.toggle()`	切换聊天的打开或关闭状态