JSONP响应未能存储在关闭中

我正在通过JSONP提出API请求，以避免跨域错误。我想将响应存储在闭合中的变量（函数表达式"模块"）中，该变量是通过两个"公共方法"访问的。

。

其中一种方法之一是模块。STORE，是API响应使用的回调。其他方法用API响应的内容更新P标签。

我单击"提交"启动API请求后，我知道该回调已成功调用，因为我可以在消失之前简要看到更新的显示。

我认为一旦函数退出，我必须失去响应，但是关闭仍然应该能够访问私有变量。

如果我从浏览器内部调用requestjsonp（）。

我无法在JS小提琴中重新创建问题，因为它不喜欢JSONP请求。

html：

<body>
<header>Wikipedia Viewer</header>
<section>
    <div class="container">
        <p>default text</p>
        <form>
            <button>Submit</button>
        </form>
    </div>
</section>
</body>

JS：

document.addEventListener('DOMContentLoaded', addListenerToButton);
//callback for DOM load which adds a click event on the submit button
function addListenerToButton() {
var button = document.getElementsByTagName("button")[0];
button.addEventListener("click", requestJSONP); 
console.log("addListenerToButton");
};
//advoids cross browser origin error
function requestJSONP(searchTerm) {
    //dynamically create a script tag
    var scriptTag = document.createElement("script");
    //set url 
    scriptTag.src = "https://en.wikipedia.org/w/api.php?action=opensearch&search=covfefe&limit=10&namespace=0&format=json&callback=test";
    //append tag to head element 
    document.getElementsByTagName("head")[0].appendChild(scriptTag);
    console.log("got to JSONP");
};
function test(data){
        module.store(data);
}
//callback invoked when API sends reponse
var module = (function(){
    var storedValue = [];
console.log("got to module");
    return {
        store: function(val){
            storedValue.push(val);
            console.log("got to module.store");
            displayArray(); 
        },
        retrieve: function(){
            return storedValue;
        },
    }
}());
function displayArray(){
    var stored = module.retrieve(); 
    pTag = document.getElementsByTagName("p")[0];
    text = pTag.textContent = stored;
}

默认行为（至少在chrome中）是刷新页面，它正在清除存储的值。我已经覆盖了下面的这种默认行为：

function saveText(event) {
    debugger
    event.preventDefault()
    var userInput = document.getElementsByTagName("input")[0].value;
    if (userInput === "") {
        alert("Please enter a search term")
        return 
    }
    requestJSONP(userInput);
    console.log("saveText");
};

相关内容

最新更新

热门标签：