清除后，jquery textarea自动完成功能不显示
清除后，jquery textarea自动完成功能不显示
提问于 2019-02-18 12:31:34
我的代码发生了一些非常奇怪的事情:我使用jQuery autocomplete来填写设备表单并通过ajax发送它。由于您可以在不刷新浏览器的情况下输入多个设备项，因此当窗体对话框打开时，我将清除所有字段。不幸的是，文本区域字段被清除，但不会自动完成。让我大吃一惊的是，如果我检查文本区域，它会显示为已填充(见图)。
如果我注释$(“#.val”)text(‘’)；行(当然，该字段不会重置)，它实际上是有效的。未显示任何错误。导致这种行为的原因可能是什么？代码尽可能精简，代码如下：
<script>
$(document).ready(function() {
var equipment = [
{
id: "",
label: "",
text: "",
category: "",
rev_type: "",
price: "",
cost: "",
time: ""
},
{
id: "1",
label: "Delete",
text: "",
category: "4",
rev_type: "1",
price: "0.00",
cost: "0",
time: "0"
},
{
id: "32",
label: "Samsung 55\" LED Monitor",
text: "",
category: "3",
rev_type: "1",
price: "650.00",
cost: "150",
time: "60"
},
{
id: "31",
label: "ART Audio DI",
text: "",
category: "4",
rev_type: "1",
price: "55.00",
cost: "0",
time: "0"
},
{
id: "30",
label: "Whirlwind PC Stereo DI",
text: "",
category: "4",
rev_type: "1",
price: "55.00",
cost: "0",
time: "0"
}
];
</script>
<script>
$(document).ready(function(){
updateTotal();
function clearForm() {
// clean fields
$( "#text").val('');
return false;
}
$( document).on( 'click', '.add_edit_equipment', function(){
clearForm();
/* ***** Dialog ***** */
});
});
</script>
<script>
$(document).ready(function() {
$("body").on("focus", ".equipment", function() {
$( this ).autocomplete({
source: equipment,
focus: function( event, ui ) {
$( "#add_edit_form #equipment" ).val( $(this).html(ui.item.label).text() );
return false;
},
select: function( event, ui ) {
$( "#text" ).html( ui.item.text ).text();
itemSubTotal();
return false;
}
})
});这个领域给我带来了问题：
<textarea id="text" class="form-control" name="text" cols="55" rows="5" placeholder="Description"></textarea>答:我仍然不知道为什么它停止工作并给我这个问题，但当我替换以下行时，它又开始工作了
$( "#text" ).html( ui.item.text ).text();使用
$( "#text" ).val( ui.item.text );谢谢你们！
回答 1
Stack Overflow用户
发布于 2019-02-18 15:53:31
你可以试试这样的东西。
参考http://api.jqueryui.com/autocomplete/
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<textarea id="text" class="form-control" name="text" cols="55" rows="5" placeholder="Description"></textarea> <br/>
<input type="text" class="equipment" placeholder="Enter text to search"/>
<input type="button" id="clear" value="Clear"/>
<input type="button" id="fill" value="Fill"/>
<script>
$(document).ready(function(){
$("#clear").click(function(){
$( "#text" ).html( "" );
});
$("#fill").click(function(){
$( "#text" ).html( "X" );
});
var equipment = [
"ActionScript",
"Asp",
"BASIC",
"C",
"C++",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"Scala",
"Scheme"
];
$( ".equipment" ).autocomplete({
source: equipment,
select: function( event, ui ) {
$( "#text" ).html( ui.item.label);
return true;
}
});
});
</script>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54740523
复制相关文章
相似问题
腾讯云开发者
