如何在我开始在文本框中打印时删除自动完成选择？
问题描述：
我使用jquery自动完成功能。如何在我开始在文本框中打印时删除自动完成选择？
$(document).ready(function() {
$("#suggest").autocomplete({
delay: 100,
source: function (request, response) {
// Suggest URL
var suggestURL = "https://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
suggestURL = suggestURL.replace('%QUERY', request.term);
// JSONP Request
$.ajax({
method: 'GET',
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
url: suggestURL
})
.success(function(data){
response(data[1]);
});
},
select: function(event, ui){$('.tags_id').text(ui.item.value);},
});
});<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<input type="text" placeholder="type something ..." id="suggest" />
Chose: <span class="tags_id"></span>这里是FIDDLE!
正如你可以或看到，当我选择它显示在span元素从自动完成 项目，当我开始打印，如果我在自动完成删除文本输入先前的选择显示，而我需要删除以前的选择每次我在自动完成输入打印或删除它。
我的问题是如何清除tags_id范围，当我在自动完成输入中打印或删除所有文本？
答
您可以尝试为autocomplete添加open事件处理程序以实现上述目的。
$(document).ready(function() {
$("#suggest").autocomplete({
delay: 100,
source: function (request, response) {
// Suggest URL
var suggestURL = "https://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
suggestURL = suggestURL.replace('%QUERY', request.term);
// JSONP Request
$.ajax({
method: 'GET',
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
url: suggestURL
})
.success(function(data){
response(data[1]);
});
},
select: function(event, ui){$('.tags_id').text(ui.item.value);},
open: function(event, ui) {$('.tags_id').text('');}
});
});<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
<input type="text" placeholder="type something ..." id="suggest" />
Chose: <span class="tags_id"></span>你可以试试这个。观察JS中的open事件。
答
$(document).ready(function() {
$("#suggest").autocomplete({
delay: 100,
source: function (request, response) {
// Suggest URL
var suggestURL = "https://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
suggestURL = suggestURL.replace('%QUERY', request.term);
// JSONP Request
$.ajax({
method: 'GET',
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
url: suggestURL
})
.success(function(data){
response(data[1]);
});
},
select: function(event, ui){$('.tags_id').text(ui.item.value);},
search: function(event, ui) {$('.tags_id').text('');}
});
});<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<input type="text" placeholder="type something ..." id="suggest" />
Chose: <span class="tags_id"></span>可以使用回调事件search之前，新的搜索它触发。所以那个时候删除你以前的选择。
答
请清除数据Like - $（'。tags_id'）。text（“”）;在源功能如下它可以帮助你：
$（文件）。就绪（函数（）{
$("#suggest").autocomplete({
delay: 100,
source: function (request, response) {
// Suggest URL
var suggestURL = "http://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
suggestURL = suggestURL.replace('%QUERY', request.term);
$('.tags_id').text("");
// JSONP Request
$.ajax({
method: 'GET',
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
url: suggestURL
})
.success(function(data){
response(data[1]);
});
},
select: function(event, ui){
$('.tags_id').text(ui.item.value);},
});
}）;
你是什么意思“打印在自动完成”？ –
我的意思是在自动填写文本框中打印 – Michael