JQuery UI Plug-in implementation Baidu Teleprompter effect _jquery

This example for you to share the jquery automatic text hint function for everyone to refer to, the specific content as follows

You need to implement dynamic additions in your project, delete the input boxes, and have text prompts inside each box.
JS section:

Automatic prompt function tip (obj) {$ (obj). AutoComplete ({minlength:0, source:function (Request, RE 
          Sponse) {//alert (' Dsada '); 
          var title = $ (' #test1 '). Val (); 
            $.ajax {url: ' hotlist.php?act=title ', type: ' Get ', DataType: ' JSON ', Data:request, Success:function (dataobj) {//Request object has only one term attribute, corresponding user input text/ /response is a function that gives the JSON data to the function after you have processed and obtained the data, so that the AutoComplete can display the list//self processing and get the data according to the data ...//var Dataobj = data; Represents the processed JSON data response (DATAOBJ); 
              Finally give the data to AutoComplete to show}, Error:function (XMLHttpRequest, Textstatus, Errorthrown) { 
              Alert (' Get information failed '); 
              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 $ ("<li>") 
    . Append ("<a>" + item.id + "<br>" + item.title + "</a>"). APPENDTO (UL); 
  };  }

HTML:

<div class= "Control-group" > <label class= "Control-label" >* related recommendations </label> <div class= "Controls" &G 
     T <?php foreach ($listOne [' Recommend_title '] as $k => $v) {?> <div> <input type= ' hidden ' name= ' tu Ijian_id[] "value=" <?php echo $listOne [' title_id '] [$k];?> "/> <input type=" text "Name=" tuijian[] "class= "Show_goods" onkeyup= "tip (This)" value= "<?php echo $v;? > "/> <span class=" btn "onclick=" del (this); " > Delete </span> </div> }?> <p id= "project-description" ></p> <span class= "btn" id= "Add" onclick= "Add (this);" > Add </span> <script>//Add recommendation node function add (obj) {var str = "<div><in Put type= ' hidden ' name= ' tuijian_id[] '/><input type= ' text ' class= ' show_goods ' name= ' tuijian[] ' onkeyup= ' Tip ( This] '/> <span class= ' btn ' onclick= ' del (this); ' 
             > Delete </span></div> "; $ (obj). Before (StR); ///delete the currently recommended node function del (obj) {if ($ (". Show_goods"). Length <= 3) {alert (' minimum required 
         Three recommended titles '); 
         return false; 
         } else {$ (obj). Parent (). remove (); 
         $ (obj). Prev (). Prev (). remove (); 
         $ (obj). Prev (). remove (); 
          $ (obj). Remove ();  }} </script> </div> </div>

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.