在 JS 中无法输出 link

Question

我正在学习如何创建一个非常简单的 HTML、CSS、JS 聊天机器人，我运行遇到了一些麻烦，我希望有人可以帮我。

当我输入“Hey”时，它会输出“Hello!”正如预期的那样，但是当我尝试我的“test link”响应时，我不知道如何显示它。任何想法我可能做错了什么？澄清一下，当用户输入“test link”时，我希望它输出“我可以帮你找到你要找的东西。点击这里！”与“点击这里！”从 link 到 google.com.

如有任何帮助，我们将不胜感激！

<script> 
function talk(){    
var know = {        
    "Hey":"Hello!",
        
    "test link":"I can help you find what you're looking for." + <a href="https://www.google.com/">Click Here!</a>  
    
};

var user = document.getElementById('userBox').value;
document.getElementById('chatLog').innerHTML = user + "<br>";
if(user in know){
    document.getElementById('chatLog').innerHTML = know[user] + "<br>";
}else{
    document.getElementById('chatLog').innerHTML = "I do not understand.";
}
}

</script>

Answer 1

如果不转义或使用模板文字（反引号），就不能嵌套相同的引号
```
"test link": `I can help you find what you're looking for. <a href="https://www.google.com/">Click Here!</a>`
```
请参阅下面我的代码片段中的工作示例：
我建议使用事件侦听器而不是点击处理程序
如果你包裹在一个表单中，输入将运行函数

在字段中输入 test link 以查看 link

const know = {
  "hey": "Hello! Type <span class=\"cursive\">test link</span> to see the link",
  "test link": `I can help you find what you're looking for. <a href="https://www.google.com/">Click Here!</a>`
};

window.addEventListener("load", function() { // when page loads
  document.getElementById("testForm").addEventListener("submit", function(e) { // pass the event
    e.preventDefault(); // so we can block the submit

    const user = document.getElementById('userBox').value.toLowerCase(); // handle hey AND HEY and Hey
    document.getElementById('chatLog').innerHTML = user + "<br>";
    if (user in know) {
      document.getElementById('chatLog').innerHTML = know[user] + "<br>";
    } else {
      document.getElementById('chatLog').innerHTML = "I do not understand.";
    }
  })
})

.cursive { color: red; font-style: italic; }

<form id="testForm">
  <input type="text" id="userBox" />
</form>

<div id="chatLog"></div>

Answer 2

您的测试 link 值不是单个字符串，因为您的引号没有围绕整个属性值。试试这个： "test link":`I can help you find what you're looking for. <a href="https://www.google.com/">Click Here!</a>`

在 JS 中无法输出 link

Trouble outputting link within JS

html

javascript

function

chatbot