大佬教程收集整理的这篇文章主要介绍了如何从php输出到typeahead?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我该怎么编码输出
输出:
echo '<a href="results.html" class="searchres" onclick="navigate()" style="color:#696969;text-decoration:none;"><img src='.$iurl.' class="icons" /><div class="results" style="color:#696969;text-decoration:none;">'."$fname".'</div><span style="color:#696969;text-decoration:none;" class="author">'.$caption.'</span></a>'."\n";
HTML:
<!DOCTYPE html> <html lang="en"> <head> <Meta charset="UTF-8"> <title>Example of Twitter Typeahead</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script type="text/javascript" src="../js/typeahead.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('input.typeahead').typeahead({ name: 'countries',prefetch: 'getvalues.PHP',limit: 10 }); }); </script> <style type="text/css"> .bs-example{ font-family: sans-serif; position: relative; margin: 100px; } .typeahead,.tt-query,.tt-hint { border: 2px solid #CCCCCc; border-radius: 8px; font-size: 24px; height: 30px; line-height: 30px; outline: medium none; padding: 8px 12px; width: 396px; } .typeahead { BACkground-color: #FFFFFF; } .typeahead:focus { border: 2px solid #0097CF; } .tt-query { Box-shadow: 0 1px 1px rgba(0,0.075) inset; } .tt-hint { color: #999999; } .tt-dropdown-menu { BACkground-color: #FFFFFF; border: 1px solid rgba(0,0.2); border-radius: 8px; Box-shadow: 0 5px 10px rgba(0,0.2); margin-top: 12px; padding: 8px 0; width: 422px; } .tt-suggestion { font-size: 24px; line-height: 24px; padding: 3px 20px; } .tt-suggestion.tt-is-under-cursor { BACkground-color: #0097CF; color: #FFFFFF; } .tt-suggestion p { margin: 0; } </style> </head> <body> <div class="bs-example"> <input type="text" class="typeahead tt-query" autocomplete="off" spellcheck="false"> </div> </body> </html>
<?PHP require_once "config.PHP"; $q = strtolower($_GET["q"]); if (!$q) return; $sql = "SELEct file_name,img_url,captions from completer"; $rsd = MysqL_query($sql); while($rs = MysqL_fetch_array($rsd)) { $fname = $rs['file_name']; $iurl = $rs ['img_url']; $caption = $rs ['captions']; echo '<a href="results.html" class="searchres" onclick="navigate()" style="color:#696969;text-decoration:none;"><img src='.$iurl.' class="icons" /><div class="results" style="color:#696969;text-decoration:none;">'."$fname".'</div><span style="color:#696969;text-decoration:none;" class="author">'.$caption.'</span></a>'."\n"; } ?>
$return = array(); while($rs = MysqL_fetch_array($rsd)) { $result[] = "..."; } echo json_encode($result);
但默认情况下,结果是在输出之前进行的html转义,因此您无法获得预期的结果,但请参阅建议列表中的HTML代码.要使用自定义HTML设计条目,您应该使用here所述的模板.
您的$result数组条目可能如下所示,以提供您在html中的字段:
$result[] = array( "iurl" => "...","fname" => "...","caption" => "..." );
…然后按照描述填写模板.
另一件事:你正在使用的prefetch选项不是typeahead之一,而是bloodhound,它通常与typeahead一起使用,但需要先进行初始化,然后将typeahead作为源.看看here,这很容易.
Bloodhound就可以将固定数据集作为数组(通过本地选项),固定数据集通过URL(通过预取选项)或者可以对URL进行查询,这是您最近想要做的事情,因为您获取$的值在PHP代码中_GET [“q”].@L_489_35@种情况下,您必须在sql中使用$q并使用远程选项初始化bloodhound,如下所示:
remote: { url: 'getvalues.PHP?q=%QUERY',wildcard: '%QUERY' }
您不需要这样做,因为它将在客户端通过typeahead.js再次过滤…这只是性能和结果数量的问题.如果只有少数,请使用bloodhounds prefetch选项.
以上是大佬教程为你收集整理的如何从php输出到typeahead?全部内容,希望文章能够帮你解决如何从php输出到typeahead?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。