|
|
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有帐号？立即注册
x
看到好的帖子最好up一下，以使得更多的人得到分享。 </p> 本人用PHP + js仿照的百度搜刮时输出内容带提醒的功效，运转的话需求PHP情况。也算是本人的一个练笔题吧，和人人分享一下
<?php
$aName = array("王成","王瑞","王祥","何武昌","何睿","何好","马兴","马成栋","张相","张祥");
$aId = array(88801,11144,2345,9023,12415,88021,11145,2344,11145,0376);
foreach($aName as $k =>$val)
{
$json[$k] = array(
'id' => $aId[$k],
'name' => $val
);
}
/**************************************************************
*
* 利用特定function对数组中一切元素做处置
* @param string &$array 要处置的字符串
* @param string $function 要履行的函数
* @return boolean $apply_to_keys_also 是不是也使用到key上
* @access public
*
*************************************************************/
function arrayRecursive(&$array, $function, $apply_to_keys_also = false)
{
static $recursive_counter = 0;
if (++$recursive_counter > 1000) {
die('possible deep recursion attack');
}
foreach ($array as $key => $value) {
if (is_array($value)) {
arrayRecursive($array[$key], $function, $apply_to_keys_also);
} else {
$array[$key] = $function($value);
}
if ($apply_to_keys_also && is_string($key)) {
$new_key = $function($key);
if ($new_key != $key) {
$array[$new_key] = $array[$key];
unset($array[$key]);
}
}
}
$recursive_counter--;
}
/**************************************************************
*
* 将数组转换为JSON字符串（兼容中文）
* @param array $array 要转换的数组
* @return string 转换失掉的json字符串
* @access public
*
*************************************************************/
function JSON($array) {
arrayRecursive($array, 'urlencode', true);
$json = json_encode($array);
return urldecode($json);
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html;charset=gb2312" http-equiv="content-type" />
<style type="text/CSS">
.name{cursor:pointer;}
.selected{background:#CCC;}
.normal{background:#FFF;}
</style>
</head>
<table align="center">
<tr>
<td>输出测试：</td>
<td><input type="text" style="color:" id="neirong" onkeyup="tip(event,0)"/></td>
</tr>
</table>
<div id="showMessage" style="border:1px #666 solid;">
</div>
<script type="text/javascript">
window.onload = function(){
var tag = document.getElementById("showMessage");
tag.style.display = "none";
}
function tip(event) {
var aUserName = new Array();
var aTempName, aUserName, tag, sVal, sHtml, mesTag, selectedTag, didTag, widths;
var postion = new Array();
var sId = 0;//用于给每一个名字加一个id的按次
var whichType;//用户输出的类型，是数字呢仍是中文。
aUserName = <?php echo JSON($json); ?>;
//aUserName = eval('(' + aTempName + ')');
tag = document.getElementById("neirong");
didTag = document.getElementById("did");
//输出框坐标获得
postion = getElementPos(tag);
//显示div坐标调剂
mesTag = document.getElementById("showMessage");
mesTag.style.position = "absolute";
mesTag.style.left = postion[0]
mesTag.style.top = postion[1];
widths = tag.style.width + "px";
mesTag.width = widths;
var event = event window.event;
var sKeyCode = event.keyCode;
var aShangXia = new Array(37,38,39,40);
var isDerection;
sVal = tag.value;
//以enter作为用户输出停止标记
if(13!=sKeyCode) {
for(var i in aShangXia) {
if(sKeyCode == aShangXia) {
isDerection = false;
break;
}
else {
isDerection = true;
}
}
if(isDerection) {
sHtml = '';
if(""==sVal) {
mesTag.style.display = "none";
mesTag.innerHTML = sHtml;
return false;
}
else {
sHtml = '<table width="146px" border="0" id="showTable">';
if(checkVal(sVal)) {
for(var i in aUserName)
{
if(0<=aUserName[i].id.indexOf(sVal)) {
sHtml = sHtml + '<tr><td class="normal" onclick="clickToChoice('+sId+')" onmou搜索引擎优化ver="changeColor(true,'+sId+')" onmou搜索引擎优化ut="changeColor(false,'+sId+')" id="p_'+sId+'" readonly="readonly">'+aUserName[i].id+'_'+aUserName[i].name+'</td></tr>';
sId = sId + 1;
}
}
}
else {
for(var i in aUserName)
{
if(0<=aUserName[i].name.indexOf(sVal)) {
sHtml = sHtml + '<tr><td class="normal" onclick="clickToChoice('+sId+')" onmou搜索引擎优化ver="changeColor(true,'+sId+')" onmou搜索引擎优化ut="changeColor(false,'+sId+')" id="p_'+sId+'" readonly="readonly">'+aUserName[i].id+'_'+aUserName[i].name+'</td></tr>';
sId = sId + 1;
}
}
}
sHtml = sHtml + '</table>';
if(0!=sId) {
mesTag.style.display = "";
mesTag.innerHTML = sHtml;
sHtml = '';
}
else {
mesTag.innerHTML = '没有了局';
}
}
}
else
{
if(38==sKeyCode40==sKeyCode) {
dance(sKeyCode,sVal,tag);
}
}
}
else {
if(''!=tag.value) {
mesTag.innerHTML = '';
showMessage.style.display = 'none';
}
else {
return false;
}
}
}
function checkVal(sVal){
var patrn = /^[0-9]/;
if(patrn.exec(sVal)) {
return true;
}
else {
return false;
}
}
//获得用户经由过程点击的名字
function clickToChoice(sqnm) {
var choicedTag, mesTag, showTag;
choicedTag = document.getElementById("p_"+sqnm);
mesTag = document.getElementById("neirong");
showTag = document.getElementById("showTable");
mesTag.value = choicedTag.innerHTML;
showMessage.style.display = 'none';
}
function dance(sKeyCode,sVal,tag) {
var danceTag = getElementsByClassName("normal");//这个是正常的行
var danceingTag = getElementsByClassName("selected");//这个是前一个被选中的行
var selectedTag, lastTag, showTag, selectedVal, currentNum, initial;
var rowNums, selectedNum = 0;
var danceLen = danceTag.length;
if(0 != danceingTag.length) {
showTag = document.getElementById("showTable");
rowNums = showTag.rows.length;
currentNum = danceingTag[0].id.split("_")[1] * 1;
switch(sKeyCode) {
case 40:
if(rowNums == (currentNum + 1)) {
selectedNum = 0;
}
else {
selectedNum = currentNum + 1;
}
break;
case 38:
if(0 == currentNum ) {
selectedNum = rowNums - 1;
}
else {
selectedNum = currentNum - 1;
}
break;
}
}
else {
switch(sKeyCode) {
case 40:
currentNum = danceTag.length - 1;
selectedNum = 0;
break;
case 38:
currentNum = 0;
selectedNum = danceTag.length - 1;
break;
}
}
lastTag = document.getElementById("p_"+currentNum);
lastTag.className = "normal";
selectedTag = document.getElementById("p_"+selectedNum);
selectedVal = selectedTag.innerHTML;
selectedTag.className = "selected";
tag.value = selectedVal;
}
function changeColor(type,sqnm) {
var tag = document.getElementById("p_"+sqnm);
if(type) {
tag.className = "selected";
}
else {
tag.className = "normal";
}
}
function getElementsByClassName(n) {
var classElements = [],allElements = document.getElementsByTagName('*');
for (var i=0; i< allElements.length; i++ )
{
if (allElements[i].className == n ) {
classElements[classElements.length] = allElements[i]; //某类纠合
}
}
return classElements;
}
function getElementPos(tag) {
var ua = navigator.userAgent.toLowerCase();
var isOpera = (ua.indexOf('opera') != -1);
var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof
if (tag.parentNode === null tag.style.display == 'none') {
return false;
}
var parent = null;
var pos = [];
var box;
if (tag.getBoundingClientRect)
{
box = tag.getBoundingClientRect();
var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
pos[0] = box.left + scrollLeft + "px";
pos[1] = box.bottom +scrollTop + "px";
return pos;
}
}
</script>
</body>
</html>
实现固定数量的几张图片的上传；再如调试软件ZendStudio的使用，看了很多次老师的应用，但总感觉用的不顺手，不懂那么多的数据值，到底哪一个才是真正的问题所在；还有如数据库语句的封装，我只会用简单的函数来进行封装。 |
|
|Archiver|手机版|仓酷云
鄂ICP备14007578号-2
发表于 2015-2-16 00:22:10
收藏
转播
分享
淘帖
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜