Question

我正在使用WinJS.UI.AutoSuggestBox。每次当我从suggestionCollection中选择项目时，该项目都会出现在输入中，但是当我点击其他地方（输入失去焦点）时，该项目将从输入中消失，我的搜索文本将在输入中消失。

与示例相同：http://winjs.azurewebsites.net/#searchbox。

如何在失去焦点后让我的选择文本保留在AutoSuggestBox中？

我也很欣赏一些关于WinJS的例子的好文档，我是新来的，而且我总是有问题快速找到我需要的东西，而不用看十几个帖子。

Answer 1

这里的要点是，您想要的并不是AutoSuggestBox的设计体验。它的设计方式使得用户可以随着时间的推移继续改进他/她的输入，这就是当输入控件失去焦点时它被保留的原因。

顺便说一下，如果你有充分的理由去破解它，请按照以下方式：

1.您需要保存选定的建议：

var lastQuery; 

function querySubmittedHandler(eventObject) {
    var queryText = eventObject.detail.queryText; 
    lastQuery = queryText;
    ...
}

2.您需要在输入控件中订阅onblur事件。这是一个棘手的问题，因为这个控件是动态创建的：

var box;
WinJS.UI.processAll().then(function(){
    box = document.getElementById("autoSuggestBox"); 
    // this is how to get internal input
    box.winControl.element.querySelector("input").onblur = onblurinput; 
    // alternative
    // document.querySelector("#autoSuggestBox input").onblur = onblurinput;
});

3.Inside onblurhandler手动更新输入的文本值：

function onblurinput() {
    box.winControl.queryText = lastQuery;  
}

WinJS AutoSuggestBox保留选定的建议

1 个答案: