显示函数(JavaScript)中属性的建议

Showing suggestions for attributes within a function (JavaScript)

本文关键字:属性 函数 JavaScript 显示      更新时间:2023-09-26

所以这有点难用词,但我会尽我所能让它变得容易理解:)

我正在制作一个命令驱动的个人助理(处于开发的早期阶段),基本上用户可以输入不同的命令或问题,助理会回答问题或完成任务。例如,如果用户在文本框中键入"What is the time?",则会出现一个对话框,其中包含对话框中的时间。因此,我想要的是,当用户键入(例如)"what"时,它会建议"what is the time",因为这是函数中的属性之一(当我发布代码时,你会明白的)。

以下是javascript(抱歉搞砸了):

// JavaScript Document
function searchKeyPress(e){
        e = e || window.event;
        if (e.keyCode == 13){
            document.getElementById('btn').click();
        }
}
function command() {
    var srchVar = document.getElementById("srch");
    var srch = srchVar.value;
    var expression = /[-a-zA-Z0-9@:%_'+.~#?&//=]{2,256}'.[a-z]{2,4}'b('/[-a-zA-Z0-9@:%_'+.~#?&//=]*)?/gi;
    var regex = new RegExp(expression);
    var t = srch;
    if(srch == '') { alert('Please do not leave the field empty!'); }
    else if(srch.indexOf('about') != -1) { alert('The function of this project is to complete simple tasks and sometimes answer simple questions. 'n'nMade by Omar Latreche. 'n'n(c) Copyright Omar Latreche 2015'); }
    else if(srch.indexOf('commands') != -1) { window.location = "commands.html"; }
    else if(srch.indexOf('time') != -1) { alert('The current time according to your computer is' + ShowTime(new Date())); }
    else if(srch.indexOf('what') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('when') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('where') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('why') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('how') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('who') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch.indexOf('?') != -1) { if (confirm('I can see that is a question. Would you like to search Google for the answer?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
    else { /* Nothing */ }; }
    else if(srch === 'okay assistant') { alert('Hello! How can I help you?'); }
    else if(srch.indexOf('weather') != -1) { window.open('https://www.google.com/#q=weather', '_blank'); }
    else if(t.match(regex)) { window.open(srch, '_blank'); }
    else { if (confirm('I am sorry but I do not understand that command. Would you like to search Google for that command?') == true) { window.open('https://www.google.com/#q=' + srch, '_blank'); }
        else { /* Nothing */ }
    }
}
//Show time in 12hour format
var ShowTime = (function () {
    function addZero(num) {
        return (num >= 0 && num < 10) ? "0" + num : num + "";
    }
    return function (dt) {
        var formatted = '';
        if (dt) {
            var hours24 = dt.getHours();
            var hours = ((hours24 + 11) % 12) + 1;
            formatted = [formatted, [addZero(hours), addZero(dt.getMinutes())].join(":"), hours24 > 11 ? "PM" : "AM"].join(" ");            
        }
        return formatted;
    }
})();

这是HTML:

<!DOCTYPE html>
<html>
<head>
<title>Tiny Assistant</title>
<script type="text/javascript" src="script.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="cont_title">
    <span class="title">Tiny</span><span class="title2"> Assistant</span>
</div>
<div class="cont">
    <input name="srch" id="srch" class="search" spellcheck="false" onkeypress="searchKeyPress(event);" placeholder="Type &quot;Okay Assistant&quot;" type="text" />
</div>
<div style="margin-top:10px" class="cont">
    <!--<input type="submit" onClick="command();" class="button" value="Done" id="btn" />-->
    <button type="submit" id="btn" aria-label="Done" class="button" onClick="command();">
        <span class="btn_txt">Done</span>
    </button>
</div>
<div style="margin-top:10px" class="cont">
    <span class="info">&copy; Copyright Omar Latreche 2015. All rights reserved.</span>
</div>
</body>
</html>

我对这篇文章感到抱歉,但这是我唯一能想到的表达方式。我希望你能理解我想说的话。

请看一下这个:

https://jqueryui.com/autocomplete/