jQuery UI插件实现百度提词器效果

本文实例为大家分享了jQuery自动文字提示功能，供大家参考，具体内容如下

需要在项目中实现动态添加，删除输入框，每个框里面都要有文字提示。
js部分：

//自动完提示 
  function tip(obj) { 
    $( obj ).autocomplete({ 
 minLength: 0, 
 source: function (request, response) { 
   //alert('dsada'); 
   var title = $('#test1').val(); 
   $.ajax({ 
     url: "HotList.php?act=title", 
     type: 'get', 
     dataType: "json", 
     data: request, 
     success: function (dataObj) { 
// request对象只有一个term属性，对应用户输入的文本 
// response是一个函数，在你自行处理并获取数据后，将JSON数据交给该函数处理，以便于autocomplete根据数据显示列表 
 
// 自行处理并获取数据... 
//var dataObj = data; // 表示处理后的JSON数据 
response(dataObj); // 最后将数据交给autocomplete去展示 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
//alert('获取信息失败'); 
//alert(XMLHttpRequest.status); 
//alert(XMLHttpRequest.readyState); 
//alert(textStatus); 
     } 
   }); 
 }, 
 focus: function( event, ui ) { 
   $( obj ).val( ui.item.title ); 
   return false; 
 }, 
 select: function( event, ui ) { 
   //$( "#project" ).val( ui.item.title ); 
   //$( "#project-id" ).val( ui.item.id ); 
   $(obj).val( ui.item.title ); 
   $(obj).prev().val( ui.item.id ); 
   return false; 
 } 
      }) 
      .data( "ui-autocomplete" )._renderItem = function( ul, item ) { 
      return $( "
" ) 
 .append( "" + item.id + "
" + item.title + "" ) 
 .appendTo( ul ); 
    }; 
  } 

html：

 
 *相关推荐 
    
      $v) { ?> 
    
     
     删除 
     
     
    
 
    添加 
     
  
 

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。