BootStrap学习2 typeahead
首先看看这些
http://www.wrapcode.com/bootstrap/typeahead-json-objects/
http://stackoverflow.com/questions/9232748/twitter-bootstrap-typeahead-ajax-example
http://stackoverflow.com/questions/16961561/update-function-for-typeahead
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <link href="css/bootstrap.css" rel="stylesheet"> </head> <body> <input type="text" id="myElement"/> <script src="js/jquery-1.8.0.min.js" type="text/javascript"></script> <script src="js/bootstrap.js" type="text/javascript"></script> <script type="text/javascript"> $('#myElement').typeahead({ source: function (query, process) { return $.getJSON( 'info2.php', { query: query }, function (data) { return process(data.options); }); } }); </script> </body> </html>
后台
<?php
$query=$_REQUEST['query'];
$str="";
if(!empty($query))
if (false !== strpos($query, 'or')) {
$str="{\"options\": [\"ori 1\",\"ori 2\",\"ori 3\",\"ori 4\",\"ori 5\"]} ";
if(false !== strpos($query,'oric')){
$str="{\"options\": [\"oricon 1\",\"oricon 2\",\"oricon 3\",\"oricon 4\"]} ";
}
}else if(false !== strpos($query, 'de')){
$str="{\"options\": [\"Dell 1\",\"Dell 2\",\"Dell 3\",\"Dell 4\"]} ";
}else if(false !== strpos($query, 'ro')){
$str="{\"options\": [\"royal ships\",\"Royal Caribbean\",\"Royal Cruises\",\"royal 4\"]} ";
}
echo $str;
?>
strpos函数就用来检测是否含有子串
