If the function is written to execute the function immediately or put inside other functions, the execution fails.

I am doing a navigation home page, do search, want to use Baidu search intelligent prompt function, encountered a strange problem. The code is as follows:

<body>
    <input type="text" id="q">
    <ul id="show"></ul>
    <script>
        function solve(data) { //API
            var Show = document.getElementById("show");
            var html = "";

            if (data.s.length) {
                Show.style.display = "block";
                var len = data.s.length;
                for (var i = 0; i < len; iPP) { //
                    html += "<li><a target="_blank" href="http://www.baidu.com/s?wd=" + data.s[i] + "">" + data.s[i] + "</a></li>";
                }
                Show.innerHTML = html;
            } else {
                Show.style.display = "none";
            }
        }

        var oQ = document.getElementById("q"),
            Show = document.getElementById("show");

        oQ.onkeyup = function() { //
            if (this.value != "") {
                var oScript = document.createElement("script"); //script
                oScript.src = "http://suggestion.baidu.com/su?wd=" + this.value + "&cb=solve";
                document.body.appendChild(oScript);
            } else {
                Show.style.display = "none";
            }
        }
    </script>
</body>

the current code is executable and can run the correct results. But when I put it inside another function, the execution failed. The
code is as follows:

<body>
    <input type="text" id="q">
    <ul id="show"></ul>
    <script>
        (function() {
            function solve(data) { //API
                var Show = document.getElementById("show");
                var html = "";

                if (data.s.length) {
                    Show.style.display = "block";
                    var len = data.s.length;
                    for (var i = 0; i < len; iPP) { //
                        html += "<li><a target="_blank" href="http://www.baidu.com/s?wd=" + data.s[i] + "">" + data.s[i] + "</a></li>";
                    }
                    Show.innerHTML = html;
                } else {
                    Show.style.display = "none";
                }
            }

            var oQ = document.getElementById("q"),
                Show = document.getElementById("show");

            oQ.onkeyup = function() { //
                if (this.value != "") {
                    var oScript = document.createElement("script"); //script
                    oScript.src = "http://suggestion.baidu.com/su?wd=" + this.value + "&cb=solve";
                    document.body.appendChild(oScript);
                } else {
                    Show.style.display = "none";
                }
            }
        })()
    </script>
</body>

does any god know why?

Mar.22,2021

walking on the road, I suddenly thought of what the problem was. No, no, no.

var oScript = document.createElement("script"); 
oScript.src = 'http://suggestion.baidu.com/su?wd=' + this.value + '&cb=solve';
document.body.appendChild(oScript);

script requests data from baidu only when the tag is inserted into DOM. When the data is requested, the solve callback function is called, but there is no solve function in the current global scope, so it will fail. No, no, no.

Menu