|
 |
| |
อยากทราบวิธีการเขียน lismenu แบบมีคำค้นในตัวครับ (จากตัวอย่าง) |
| |
 |
|
|
 |
 |
|
ขอบคุณครับ
|
 |
 |
 |
 |
| Date :
2016-12-13 13:19:48 |
By :
ecom490 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ขอบคุณทุกท่านที่ให้คำแนะนำครับ
ใช้ได้ตามที่คุณ "คนธรรมดา ไม่พิเศษ" ให้มาเลยครับ
ขอบคุณ Mr.กล้า ด้วยครับ ที่แนะนำตัวเลือกเพิ่มเติม
|
| |
|
|
| |
| Date :
2016-12-13 14:39:57 |
By :
ecom490 |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
นี่เลยครับ ตกแต่งเองนะคับ
Code
<html lang="en">
<head>
<title>Search</title>
<script type="text/javascript">
<!-- Declare the array and store the values according to ur usage -->
var suggestions = new Array("กบ", "กินข้าว", "peter","hindu","huge", "test","bums","cat","kind","fight","argue","append","xML");
var outp;
var oldins;
var posi = -1;
var words = new Array();
var input;
var key;
function setVisible(visi)
{
var x = document.getElementById("shadow");
var t = document.getElementsByName("text")[0];
x.style.position = 'absolute';
x.style.top = (findPosY(t)+3)+"px";
x.style.left = (findPosX(t)+2)+"px";
x.style.visibility = visi;
}
function init()
{
outp = document.getElementById("output");
window.setInterval("lookAt()", 100);
setVisible("hidden");
document.onkeydown = keygetter; //needed for Opera...
document.onkeyup = keyHandler;
}
function findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft;
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (obj.offsetParent)
{
curtop += obj.offsetHeight;
while (obj.offsetParent)
{
curtop += obj.offsetTop;
obj = obj.offsetParent;
}
}
else if (obj.y)
{
curtop += obj.y;
curtop += obj.height;
}
return curtop;
}
function lookAt()
{
var ins = document.getElementsByName("text")[0].value;
if (oldins == ins)
return;
else if (posi > -1);
else if (ins.length > 0)
{
words = getWord(ins);
if (words.length > 0)
{
clearOutput();
for (var i=0;i < words.length; ++i)
addWord (words[i]);
setVisible("visible");
input = document.getElementsByName("text")[0].value;
}
else
{
setVisible("hidden");
posi = -1;
}
}
else
{
setVisible("hidden");
posi = -1;
}
oldins = ins;
}
function addWord(word)
{
var sp = document.createElement("div");
sp.appendChild(document.createTextNode(word));
sp.onmouseover = mouseHandler;
sp.onmouseout = mouseHandlerOut;
sp.onclick = mouseClick;
outp.appendChild(sp);
}
function clearOutput()
{
while (outp.hasChildNodes())
{
noten=outp.firstChild;
outp.removeChild(noten);
}
posi = -1;
}
function getWord(beginning)
{
var words = new Array();
for (var i=0;i < suggestions.length; ++i)
{
var j = -1;
var correct = 1;
while (correct == 1 && ++j < beginning.length)
{
if (suggestions[i].charAt(j) != beginning.charAt(j))
correct = 0;
}
if (correct == 1)
words[words.length] = suggestions[i];
}
return words;
}
function setColor (_posi, _color, _forg)
{
outp.childNodes[_posi].style.background = _color;
outp.childNodes[_posi].style.color = _forg;
}
function keygetter(event)
{
if (!event && window.event)
event = window.event;
if (event)
key = event.keyCode;
else
key = event.which;
}
function keyHandler(event)
{
if (document.getElementById("shadow").style.visibility == "visible")
{
var textfield = document.getElementsByName("text")[0];
if (key == 40)//key down
{
if (words.length > 0 && posi <= words.length-1)
{
if (posi >=0)
setColor(posi, "#fff", "black");
else
input = textfield.value;
setColor(++posi, "blue", "white");
textfield.value = outp.childNodes[posi].firstChild.nodeValue;
}
}
else if (key == 38)
{ //Key up
if (words.length > 0 && posi >= 0)
{
if (posi >=1)
{
setColor(posi, "#fff", "black");
setColor(--posi, "blue", "white");
textfield.value = outp.childNodes[posi].firstChild.nodeValue;
}
else
{
setColor(posi, "#fff", "black");
textfield.value = input;
textfield.focus();
posi--;
}
}
}
else if (key == 27)
{ // Esc
textfield.value = input;
setVisible("hidden");
posi = -1;
oldins = input;
}
else if (key == 8)
{ // Backspace
posi = -1;
oldins=-1;
}
}
}
var mouseHandler=function()
{
for (var i=0; i < words.length; ++i)
setColor (i, "white", "black");
this.style.background = "blue";
this.style.color= "white";
}
var mouseHandlerOut=function()
{
this.style.background = "white";
this.style.color= "black";
}
var mouseClick=function()
{
document.getElementsByName("text")[0].value = this.firstChild.nodeValue;
setVisible("hidden");
posi = -1;
oldins = this.firstChild.nodeValue;
}
</script>
<style type="text/css">
.output
{
font-family:Arial;
font-size: 10pt;
color:black;
padding-left: 3px;
padding-top: 3px;
border: 1px solid #000000;
width: 100px;
background: #fff;
}
.shadow
{
width:102px;
position:relative;
top: 2px;
left: 2px;
background: #555;
}
.shadow div{
position:relative;
top: -2px;
left: -2px;
}
</style>
</head>
<body>
<div align="center">
<form name="test" id="test">
<input type="text" name="text" autocomplete="off"></center>
</form>
</div>
<div class="shadow" id="shadow">
<div class="output" id="output">
</div>
</div>
</body>
</html>
ตรงส่วนพวกคำกบ หรือตัวหนังสือภาษาอังกิด ให้ดึงจากฐานข้อมูลก็ได้ครับ
Code
<?php echo "<script language="javascript">
var suggestions = new Array($objResult[Name]);
</script>
ประมานนี้ครับ แต่ผมจะไม่ทำตัวเชื่อมต่อ mysql นะคับ แต่จะแสดงถึงเวลาดึงค่าจาก mysql
|
ประวัติการแก้ไข
2016-12-14 21:25:42
2016-12-14 21:46:04
2016-12-15 07:02:31
2016-12-15 07:07:28
| |
|
|
| |
| Date :
2016-12-14 19:29:39 |
By :
Androidgamer |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 02
|
