|
 |
| |
ต้องเขียนโค้ดอย่างไรครับ คือผมมีโค้ดที่คลิกเลือกจังหวัดใน Listmenu แล้ว จังหวัดที่เลือกจะเข้าไปแสดง |
| |
 |
|
|
 |
 |
|
เอาโค๊ดมาดูเด๋วงงตาย
|
 |
 |
 |
 |
| Date :
2010-07-14 09:54:31 |
By :
Dragons_first |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ตามนี้ครับ.....
Code (PHP)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
select#RETURN_ROUTE{
width:650px;
color:#333333;
background-color:#EAEAEA;
border:1px solid #999999;
}
select#RETURN_ROUTE option{
color:#333333;
background-color:#EAEAEA;
border:1px solid #999999;
}
ul.myUL2{
margin:0px;
padding:0px;
font-size:12px;
width:200px;
color:#333333;
background-color:#EAEAEA;
border:1px solid #999999;
position:absolute;
display:none;
list-style:none;
z-index:100;
/* ถ้ารายการตัวเลือกมีมาก สามารถกำหนดความสูง แล้วให้มีมี scroll เลื่อนดูข้อมูล
โดยเอา comment สองบรรทัดล่างนี้ออก */
/* height:80px;
overflow:auto;*/
height:160px;
overflow:auto;
}
ul.myUL2 li{
margin:0px;
padding:0px;
cursor:pointer;
text-indent:5px;
list-style:none;
}
ul.myUL2 li:hover{
margin:0px;
padding:0px;
cursor:pointer;
background-color:#666666;
color:#FFFFFF;
}
</style>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
var obj1="select#RETURN_ROUTE"; // กำหนด object เป้าหมาย
var obj2="ul.myUL2"; // กำหนด object รายการตัวเลือก
$(obj1).focus(function(){
var nX=$(this).offset().left;
var nY=$(this).offset().top+($(this).height()+3);
$(this).html("");
$(obj2).show().css({
"width":$(this).width()+"px",
"left":nX,
"top":nY
});
$(obj1).html("<option value=\"\">เลือกจังหวัด</option>").blur();
});
$(obj2).children("li").click(function(){
var iCheck=($(this).children("input").attr("checked")==false)?true:false;
$(this).children("input").attr("checked",iCheck);
});
$(obj2).hover(function(){
$(this).show();
},function(){
var setValue="";
var setText="";
$(this).find("input").each(function(key){
if($(this).attr("checked")==true){
setValue+=$(this).val()+",";
setText+=$(this).parent("li").text()+",";
}
});
setText=(setText!="")?setText:"เลือกจังหวัด";
$(this).hide();
$(obj1).html("<option value=\""+setValue+"\">"+setText+"</option>").blur();
});
});
</script>
</HEAD>
<BODY>
และกลับจากปลายทางโดยผ่านจังหวัด: <br><br>
<select name="select" size="10" onChange="document.getElementById('RETURN_ROUTE').value=document.getElementById('RETURN_ROUTE').value+this.value">
<optgroup label="ภาคกลาง">
<option value=" กรุงเทพมหานคร ,">กรุงเทพมหานคร</option>
<option value=" กำแพงเพชร ,">กำแพงเพชร</option>
<option value=" ชัยนาท ,">ชัยนาท</option>
<option value=" นครนายก ,">นครนายก</option>
<option value=" นครปฐม ,">นครปฐม</option>
<option value=" นครสวรรค์ ,">นครสวรรค์</option>
<option value=" นนทบุรี ,">นนทบุรี</option>
<option value=" ปทุมธานี ,">ปทุมธานี</option>
<option value=" พระนครศรีอยุธยา ,">พระนครศรีอยุธยา</option>
<option value=" พิจิตร ,">พิจิตร</option>
<option value=" พิษณุโลก ,">พิษณุโลก</option>
<option value=" เพชรบูรณ์ ,">เพชรบูรณ์</option>
<option value=" ลพบุรี ,">ลพบุรี</option>
<option value=" สมุทรปราการ ,">สมุทรปราการ</option>
<option value=" สมุทรสงคราม ,">สมุทรสงคราม</option>
<option value=" สมุทรสาคร ,">สมุทรสาคร</option>
<option value=" สิงห์บุรี ,">สิงห์บุรี</option>
<option value=" สุโขทัย ,">สุโขทัย</option>
<option value=" สุพรรณบุรี ,">สุพรรณบุรี</option>
<option value=" สระบุรี ,">สระบุรี</option>
<option value=" อ่างทอง ,">อ่างทอง</option>
<option value=" อุทัยธานี ,">อุทัยธานี</option>
</optgroup>
<optgroup label="ภาคเหนือ">
<option value=" เชียงราย ,">เชียงราย</option>
<option value=" เชียงใหม่ ,">เชียงใหม่</option>
<option value=" น่าน ,">น่าน</option>
<option value=" พะเยา ,">พะเยา</option>
<option value=" แพร่ ,">แพร่</option>
<option value=" แม่ฮ่องสอน ,">แม่ฮ่องสอน</option>
<option value=" ลำปาง ,">ลำปาง</option>
<option value=" ลำพูน ,">ลำพูน</option>
<option value=" อุตรดิตถ์ ,">อุตรดิตถ์</option>
</optgroup>
<optgroup label="ภาคตะวันออก">
<option value=" จันทบุรี ,">จันทบุรี</option>
<option value=" ฉะเชิงเทรา ,">ฉะเชิงเทรา</option>
<option value=" ชลบุรี ,">ชลบุรี</option>
<option value=" ตราด ,">ตราด</option>
<option value=" ปราจีนบุรี ,">ปราจีนบุรี</option>
<option value=" ระยอง ,">ระยอง</option>
<option value=" สระแก้ว ,">สระแก้ว</option>
</optgroup>
<optgroup label="ภาคตะวันออกเฉียงเหนือ">
<option value=" กาฬสินธุ์ ,">กาฬสินธุ์</option>
<option value=" ขอนแก่น ,">ขอนแก่น</option>
<option value=" ชัยภูมิ ,">ชัยภูมิ</option>
<option value=" นครพนม ,">นครพนม</option>
<option value=" นคราชสีมา ,">นคราชสีมา</option>
<option value=" บุรีรัมย์ ,">บุรีรัมย์</option>
<option value=" มหาสารคาม ,">มหาสารคาม</option>
<option value=" มุกดาหาร ,">มุกดาหาร</option>
<option value=" ยโสธร ,">ยโสธร</option>
<option value=" ร้อยเอ็ด ,">ร้อยเอ็ด</option>
<option value=" เลย ,">เลย</option>
<option value=" สกลนคร ,">สกลนคร</option>
<option value=" สุรินทร์ ,">สุรินทร์</option>
<option value=" ศรีสะเกษ ,">ศรีสะเกษ</option>
<option value=" หนองคาย ,">หนองคาย</option>
<option value=" หนองบัวลำภู ,">หนองบัวลำภู</option>
<option value=" อุดรธานี ,">อุดรธานี</option>
<option value=" อุบลราชธานี ,">อุบลราชธานี</option>
<option value=" อำนาจเจริญ ,">อำนาจเจริญ</option>
</optgroup>
<optgroup label="ภาคตะวันตก">
<option value=" กาญจนบุรี ,">กาญจนบุรี</option>
<option value=" ตาก ,">ตาก</option>
<option value=" ประจวบคีรีขันธ์ ,">ประจวบคีรีขันธ์</option>
<option value=" เพชรบุรี ,">เพชรบุรี</option>
<option value=" ราชบุรี ,">ราชบุรี</option>
</optgroup>
<optgroup label="ภาคใต้">
<option value=" กระบี่ ,">กระบี่</option>
<option value=" ชุมพร ,">ชุมพร</option>
<option value=" ตรัง ,">ตรัง</option>
<option value=" นครศรีธรรมราช ,">นครศรีธรรมราช</option>
<option value=" นราธิวาส ,">นราธิวาส</option>
<option value=" ปัตตานี ,">ปัตตานี</option>
<option value=" พังงา ,">พังงา</option>
<option value=" พัทลุง ,">พัทลุง</option>
<option value=" ภูเก็ต ,">ภูเก็ต</option>
<option value=" ระนอง ,">ระนอง</option>
<option value=" สตูล ,">สตูล</option>
<option value=" สงขลา ,">สงขลา</option>
<option value=" สุราษฎร์ธานี ,">สุราษฎร์ธานี</option>
<option value=" ยะลา ,">ยะลา</option>
</optgroup>
</select>
<br><br>
<input name="RETURN_ROUTE" type="text" id="RETURN_ROUTE" size="100"><br>
</BODY>
</HTML>
|
| |
|
|
| |
| Date :
2010-07-14 09:57:27 |
By :
coollyheart |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
รบกวนดูโค้ดให้ทีครับว่าควรเพิ่มเติมตรงไหน
|
| |
|
|
| |
| Date :
2010-07-14 10:19:32 |
By :
coollyheart |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 04
|
