เปลี่ยนข้อมูลที่แสดงจาก text box เป็น label ต้องทำอย่างไรคะ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา เปลี่ยนข้อมูลที่แสดงจาก text box เป็น label ต้องทำอย่างไรคะ

เปลี่ยนข้อมูลที่แสดงจาก text box เป็น label ต้องทำอย่างไรคะ
ข้อมูลตรง text box ที่แสดง ระยะทางโดยประมาณ กับ ระยะทางจริง จะเปลี่ยนเป็น label ต้องแก้ไขยังไงคะ
ลองทำแล้วข้อมูลไม่แสดงคร่าา รบกวนผู้รู้ช่วยชี้แนะหน่อยนะคะ TT  ...ต่อจากกระทู้นี้ค่ะ https://www.ninenik.com/forum_view_1364_1.html ขอบคุณนะคะ


Theprat 49.230.79.xxx 09-01-2015 00:24:28

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Busway :: ค้นหาเส้นทาง</title>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">

<style type="text/css">
html { height: 100% }
body { 
	height:100%;
	margin:0;padding:0;
	font-family:tahoma, "Microsoft Sans Serif", sans-serif, Verdana;
	font-size:12px;
}

#map_canvas { 
	position:relative;
	width:550px;
	height:400px;
	margin: center;	
	
}
#contain_map{
	position:relative;
	width:100%;
	height:400px;
	margin:center;	
}


#showDD{
	position:Top_center;
	bottom:0px;
	height:30px;
	padding-top:5px;
	background-color:#fff;
	color:#000;
	margin: center;	
	/*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);	
*/
}
#seetypeBus{
	bottom:0px;
	height:60px;
	padding-top:5px;
	background-color:#36F;
	color:#000;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);	

}

#directionsPanel{
	/*position:auto;*/
	width:550px;
	margin:auto;
	clear:both;
	background-color:#FFC;
}

#topbar {
	BORDER-RIGHT: 0px solid; 
	PADDING-RIGHT: 0px;
	BORDER-TOP: 0px solid;
	PADDING-LEFT: 0px;
	Z-INDEX: 100;
	RIGHT: 0px;
	VISIBILITY: hidden;
	PADDING-BOTTOM: 0px;
	BORDER-LEFT: 0px solid;
	WIDTH: 110px;
	PADDING-TOP: 3px;
	BORDER-BOTTOM: 0px solid;
	POSITION: absolute;
	TOP: 300px;
	HEIGHT: 367px
}

.adp-placemark{
	background-color:#FF6;
	color:#000;	
}
.adp-summary{
	
}
.adp-directions{
	
}
#my_navigator{
	position:absolute;
	top:293px;
	right:875px;
}
/* ส่วน css สำหรับตัวควบคุม  */
#zoom_inout{
	position:absolute;
	width:32px;
	top:270px;
	right:357px;
}
#zoom_inout img{
	cursor:pointer;	
}
.gmap-control-container {
    margin: 5px;
}
.gmap-control {
    cursor: pointer;
    background-color: -moz-linear-gradient(center top , #FEFEFE, #F3F3F3);
    background-color: #FEFEFE;
    border: 1px solid #A9BBDF;
    border-radius: 2px;
    padding: 0 6px;
    line-height: 160%;
    font-size: 12px;
    font-family: Arial,sans-serif;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.35);
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.gmap-control:hover {
    border: 1px solid #678AC7;
}
.gmap-control-active {
    background-color: -moz-linear-gradient(center top , #6D8ACC, #7B98D9);
    background-color: #6D8ACC;
    color: #fff;
    font-weight: bold;
    border: 1px solid #678AC7;
}
.gmap-control-legend {
    position: absolute;
    text-align: left;
    z-index: -1;
    top: 20px;
    right: 0;
    width: 150px;
    height: 66px;
    font-size: 10px;
    background: #FEFEFE;
    border: 1px solid #A9BBDF;
    padding: 10px;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.35);
}
.gmap-control-legend ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.gmap-control-legend li {
    line-height: 160%;
}

<link href='http://fonts.googleapis.com/css?family=Raleway:600' rel='stylesheet' type='text/css'>

<style>

ul.sonarmenu{ /* Inspired by http://tympanus.net/codrops/2013/08/06/creative-link-effects */
	list-style: none;
}

ul.sonarmenu li{
 display: inline;
}

ul.sonarmenu a{
	position: relative;
	display: inline-block;
	color: #000; /* font color */
	text-decoration: none;
	margin: 10px 20px;
	text-transform: uppercase;
	font-family: 'Raleway', sans-serif; /* font style (uses Google fonts) */
	font-size: 22px; /* font size */
	letter-spacing: 2px; /* letter spacing */
	border-bottom: 2px solid transparent; /* Bottom border style */
}

ul.sonarmenu a:hover, ul.sonarmenu a:focus{
	outline: none;
	border-bottom: 2px solid #eee; /* Bottom border style on hover */
	color: #FFF;
}

ul.sonarmenu a::before, ul.sonarmenu a:after{ /* shared style for two circles */
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100px; /* width of outer circle */
	height: 100px; /* height of outer circle */
	border: 12px double rgba(0,0,0,0.1); /* style and color of circles */
	border-radius: 50%;
	content: '';
	opacity: 0;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);
	transform: translateX(-50%) translateY(-50%) scale(0.2);
}

ul.sonarmenu a:after{ /* inner circle specific CSS */
	width: 60px; /* width of inner circle */
	height: 60px; /* width of inner circle */
	border-width: 6px;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);
	transform: translateX(-50%) translateY(-50%) scale(0.8);
}

ul.sonarmenu a:hover:before, ul.sonarmenu a:hover:after{
	-webkit-animation: pulsate 1.2s infinite; /* animation name duration loop etc */
	-moz-animation: pulsate 1.2s infinite;
	-ms-animation: pulsate 1.2s infinite;
	animation: pulsate 1.2s infinite;
}

/* ### Keyframe animations ### */

@-webkit-keyframes pulsate{

  30%{
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
  }

	100%{
	opacity: 0.3;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.5);
	}

}

@-moz-keyframes pulsate{

  30%{
	opacity: 1;
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
  }

	100%{
	opacity: 0.3;
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.5);
	}

}

@-ms-keyframes pulsate{

  30%{
	opacity: 1;
	-ms-transform: translateX(-50%) translateY(-50%) scale(1);
  }

	100%{
	opacity: 0.3;
	-ms-transform: translateX(-50%) translateY(-50%) scale(0.5);
	}

}

@-keyframes pulsate{

  30%{
	opacity: 1;
	transform: translateX(-50%) translateY(-50%) scale(1);
  }

	100%{
	opacity: 0.3;
	transform: translateX(-50%) translateY(-50%) scale(0.5);
	}

}


</style>

 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
 <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
 <script type="text/javascript" src="scrolltopcontrol.js"></script>
<script src="SpryAssets/SpryTooltip.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTooltip.css" rel="stylesheet" type="text/css" />
</head>

<body bgcolor="#FFFFFF">
<br>

<table width="600" border="0" align="center">
  <tr>
    <th scope="col">&nbsp;</th>
    <th scope="col">&nbsp;</th>
    <th scope="col"><img src="Image/busway.png" width="381" height="91"  alt=""/></th>
  </tr>
</table>

<br><div id="seetypeBus">
<div><center>

 <ul class="sonarmenu">
 <li class="back">
   <div class="center"></div></li>
           <li><a href="HomeFinalTrying.php">หน้าหลัก</a></li>
            <li><a href="Admin/Assessment.php">ประเมินการให้บริการ</a></li>
            <li><a href="Quanlity.php">คุณภาพการให้บริการ</a></li>
            <li><a href="SearchMapPanal.php">ค้นหาเส้นทาง</a></li>
            <li><a href="Admin/Index.php">ผู้ดูแลเว็บไซต์</a></li>
            
      </ul>
         </center></div>
<br>
</div>

<br><br>
<div id="contain_map">
<div id="showDD"> 

<table width="100%" align="center" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <th align="center">
จาก :  <input name="namePlace" type="text" id="namePlace" size="20" placeholder="ระบุสถานที่/ป้ายหยุดรถ" />
ไป:  <input name="toPlace" type="text" id="toPlace" size="20" placeholder="ระบุสถานที่/ป้ายหยุดรถ" />
<input type="button" name="SearchPlace" id="SearchPlace" value="ค้นหา"/>
<input type="button" name="iClear" id="iClear" value="ยกเลิก" />    
    </th>
  </tr>
</table>
</div> 

<center><div id="map_canvas" align="center"></center>
</div>
<div id="my_navigator">
  <img src="Image/compass-icon.png" width="74" height="74" border="0" usemap="#Map" />
  <map name="Map" id="Map">
    <area id="north_direction" shape="rect" coords="22,3,53,21" href="#" />
    <area id="south_direction"  shape="rect" coords="22,58,55,74" href="#" />
    <area id="east_direction"  shape="rect" coords="56,28,74,49" href="#" />
    <area id="west_direction"  shape="rect" coords="-7,28,11,50" href="#" />
    <area id="go_home" shape="rect" coords="26,28,49,49" href="#" />
  </map>
</div>
 <div id="zoom_inout">
  <img src="Image/zoom-in-col.png" id="i_zoom_in" width="32" height="32" />
  <img src="Image/zoom-out-col.png" id="i_zoom_out" width="32" height="32" /> 
 </div> 


<br><br>
<br/>

<center><div> 
<form id="form_get_detailMap" name="form_get_detailMap" method="post" action="SerchMap.php">  


  <p>ระยะทางโดยประมาณ
  <input name="distance_text" type="text" id="distance_text" value="" size="17" readonly/>
    ระยะทางจริง
    <input name="distance_value" type="text" id="distance_value" value="0" size="17" readonly />  
    เมตร<br> <br />
    <input type="radio" name="radio" id="rdo1" value="CR" />
    <label for="CR">ธรรมดาครีมแดง</label>
    <input type="radio" name="radio" id="rdo2" value="CB" />
    <label for="CB">ปรับอากาศครีมน้ำเงิน</label>
    <input type="radio" name="radio" id="rdo3" value="UR" CHECKED/>
    <label for="UR">ยูโรทู</label>
    <input type="radio" name="radio" id="rdo4" value="OT" />
    <label for="OT">เอกชนร่วมบริการ</label>
    <input type="radio" name="radio" id="rdo5" value="OA" />
    <label for="OT">เอกชนร่วมบริการปรับอากาศ</label>
    <br> <br />
    <input name="cal"  type="button" id="cal" value="ราคาโดยประมาณ" OnClick="JavaScript:checkPrice(distance_value.value);"> 
    
   <input name="cSum" type="text" id="cSum"  value="0" size="17" readonly />  บาท  </p>

    
</form>    
</div></center> 
   
</div>
<table width="600" border="0" align="center">
  <tr>
    <th scope="col"><span id="sprytrigger1">**หมายเหตุ</span></th>
  </tr>
</table>
<div class="tooltipContent" id="sprytooltip1">
<b>อักษร "ร"</b> หลังสายรถประจำทาง หมายถึง <b>รถร่วมบริการ</b> <br />
อัตราค่าโดยสาร : ค่าโดยสารจะใกล้เคียงความจริงที่สุดหากเป็นรถต่อเดียว <br/>
</div>
<br><br>

<div id="directionsPanel"></div>

<script type="text/javascript">  
var directionShow;   
var directionsService;   
var map;   
var GGM;  
var myLatlng;  
var initialTo;  
var searchRoute;  
  
  
  
    function initialize() {  
        GGM=new Object(google.maps);   
        directionShow=new GGM.DirectionsRenderer({draggable:true});  
        directionsService = new GGM.DirectionsService();  
      
        myLatlng  = new GGM.LatLng(13.7278956,100.52412349999997);  
          
          
          
      
        var mymapTypeId=GGM.MapTypeId.ROADMAP;  
        var myDivObj=$("#map_canvas")[0];  
          
          
        var myOptions = {  
            zoom: 13,  
            panControl: false,  
            zoomControl: false,  
            mapTypeControl: true,  
            position: GGM.ControlPosition.TOP_LEFT,  
            mapTypeControlOptions: {  
              style: google.maps.MapTypeControlStyle.DROPDOWN_MENU  
            },  
              
          
            center: myLatlng ,  
            mapTypeId:mymapTypeId};  
              
              
            map = new GGM.Map(myDivObj,myOptions);  
            var trafficLayer = new google.maps.TrafficLayer();  
            trafficLayer.setMap(map);  
              
            var controlDiv = document.createElement('DIV');  
            $(controlDiv).addClass('gmap-control-container')  
            .addClass('gmnoprint');  
                    
            var controlUI = document.createElement('DIV');  
            $(controlUI).addClass('gmap-control');  
            $(controlUI).text('การจราจร');  
            $(controlDiv).append(controlUI);  
                    
            var legend = '<ul>'  
            + '<li><span style="background-color: #30ac3e">&nbsp;&nbsp;</span><span style="color: #30ac3e"> &gt; 80 กม. ต่อชั่วโมง</span></li>'  
            + '<li><span style="background-color: #ffcf00">&nbsp;&nbsp;</span><span style="color: #ffcf00"> 40 - 80 กม. ต่อชั่วโมง</span></li>'  
            + '<li><span style="background-color: #ff0000">&nbsp;&nbsp;</span><span style="color: #ff0000"> &lt; 40 กม. ต่อชั่วโมง</span></li>'  
            + '<li><span style="background-color: #c0c0c0">&nbsp;&nbsp;</span><span style="color: #c0c0c0"> ไม่มีข้อมูล</span></li>'  
            + '</ul>';  
            
            var controlLegend = document.createElement('DIV');  
            $(controlLegend).addClass('gmap-control-legend');  
            $(controlLegend).html(legend);  
            $(controlLegend).hide();  
            $(controlDiv).append(controlLegend);  
            
            // hover  
            $(controlUI)  
                .mouseenter(function() {  
                $(controlLegend).show();  
            })  
                .mouseleave(function() {  
                $(controlLegend).hide();  
            });  
    
            var trafficLayer = new GGM.TrafficLayer();  
                        
            GGM.event.addDomListener(controlUI, 'click', function() {  
                if (typeof trafficLayer.getMap() == 'undefined' || trafficLayer.getMap() === null) {  
                    $(controlUI).addClass('gmap-control-active');  
                    trafficLayer.setMap(map);  
                } else {  
                    trafficLayer.setMap(null);  
                    $(controlUI).removeClass('gmap-control-active');  
                }  
            });  
            
            map.controls[GGM.ControlPosition.TOP_RIGHT].push(controlDiv);  
            //end   
  
            var input = (document.getElementById('toPlace'));  
            var autocomplete = new GGM.places.Autocomplete(input);  
            var input = (document.getElementById('namePlace'));  
            var autocomplete = new GGM.places.Autocomplete(input);  
  
         //for (var i = 0; i < results.routes.legs; i++){  
      
            directionShow.setMap(map);  
            directionShow.setPanel($("#directionsPanel")[0]);  
                              
            if(map){  
            //   searchRoute();  
            }      
          
            GGM.event.addListener(directionShow, 'directions_changed', function(){  
                var results=directionShow.directions; //สำหรับส่งค่าไปให้ google ค้นหาข้อมูล  
                var distanceText=results.routes[0].legs[0].distance.text;  
                var distanceVal=results.routes[0].legs[0].distance.value;  
                $("#distance_text").val(distanceText);    
                $("#distance_value").val(distanceVal);  
            });    
              
            GGM.event.addListener(directionShow, 'routeindex_changed',function() {   
                var indexRoute=directionShow.routeIndex;  
                var results=directionShow.directions; //สำหรับส่งค่าไปให้ google ค้นหาข้อมูล  
                var distanceText=results.routes[indexRoute].legs[0].distance.text;  
                var distanceVal=results.routes[indexRoute].legs[0].distance.value;  
                $("#distance_text").val(distanceText);    
                $("#distance_value").val(distanceVal);  
            });           
    //}  
  
    }  
      
      
$(function(){ //สร้างเส้นทาง  
    searchRoute=function(FromPlace,ToPlace){   
        if(!FromPlace && !ToPlace){  
            var FromPlace=$("#namePlace").val();  
            var ToPlace=$("#toPlace").val();  
        }  
          
        var request={   
            origin:FromPlace,  
            destination:ToPlace,  
            travelMode: GGM.DirectionsTravelMode.TRANSIT,  
            provideRouteAlternatives : true,  
        };  
        //show  
        directionsService.route(request, function(results, status){  
            if(status==GGM.DirectionsStatus.OK){                  
                directionShow.setDirections(results);   
                var distanceText=results.routes[0].legs[0].distance.text;    
                var distanceVal=results.routes[0].legs[0].distance.value;  
                    
                $("#distance_text").val(distanceText);    
                $("#distance_value").val(distanceVal);    
                var route = results.routes[0];     
                              
            }else {  
       
              if (status == 'ZERO_RESULTS') {  
                alert('ไม่พบเส้นทางระหว่างต้นทางและปลายทางที่ระบุ');  
              } else if (status == 'UNKNOWN_ERROR') {  
                alert('ไม่สามารถประมวลผลได้! เนื่องจากการผิดพลาดของเซิร์ฟเวอร์ โปรดลองใหม่อีกครั้งหนึ่ง');  
              } else if (status == 'REQUEST_DENIED') {  
                alert('หน้าเว็บนี้ไม่ได้รับอนุญาตให้ใช้บริการเส้นทาง');  
              } else if (status == 'OVER_QUERY_LIMIT') {  
                alert('หน้าเว็บหายไปเกินขีดจำกัดของการร้องขอในช่วงระยะเวลาหนึ่ง');  
              } else if (status == 'NOT_FOUND') {  
                alert('กรุณาระบุตำแหน่งต้นทางหรือปลายทางให้ครบถ้วน !');  
              } else if (status == 'INVALID_REQUEST') {  
                alert('DirectionsRequest ไม่ถูกต้อง !');           
              } else {  
                alert("มีข้อผิดพลาดที่ไม่รู้จักในคำขอของคุณ Requeststatus: nn"+status);  
              }  
         }  
        });  
		
		

		
	//ปุ่มคำสั่ง
	}
	$("#SearchPlace").click(function(){
	searchRoute();
	});
	
	$("#namePlace,#toPlace").keyup(function(event){ 
	if(event.keyCode==13 && $(this).val()!=""){
	searchRoute();	
		}		
	});
	
	$("#iClear").click(function(){
	$("#namePlace,#toPlace,#distance_value,#distance_text,#cSum").val("");
	});
	
		$("#i_zoom_in").click(function(){ 
		var current_zoom=map.getZoom(); 
		map.setZoom(current_zoom 1);
	});
	
	$("#i_zoom_out").click(function(){
		var current_zoom=map.getZoom(); 
		map.setZoom(current_zoom-1); 
	});	
	
	$("area#north_direction").click(function(event){
		event.preventDefault();
		map.panBy(0,-100);
	});
	$("area#south_direction").click(function(event){
		event.preventDefault();
		map.panBy(0,100);
	});
	$("area#east_direction").click(function(event){
		event.preventDefault();
		map.panBy(100,0);
	});
	$("area#west_direction").click(function(event){
		event.preventDefault();
		map.panBy(-100,0);
	});			
	$("area#go_home").click(function(event){ 
		event.preventDefault();
		// กำหนดจุดเริ่มต้นของแผนที่
		var homeCenter=new GGM.LatLng(13.7278956,100.52412349999997);
		map.setZoom(13); 
		map.setCenter(homeCenter);
	});
  
  	
});



$(function(){
$("<script/>",
	{"type": "text/javascript",src:"//maps.google.com/maps/api/js?v=3.2&sensor=false&libraries=places&language=th&callback=initialize"
	}).appendTo("body");	
});

</script>


<script type="text/javascript">
function checkPrice(x)
	{
		var disVal=x;
if(document.form_get_detailMap.rdo1.checked == true){
		if(disVal>=26000) {
			document.form_get_detailMap.cSum.value=7;
}	

			else{
			document.form_get_detailMap.cSum.value=7;	}
	}
	
	
if(document.form_get_detailMap.rdo2.checked == true){if(disVal>=26000) {
			document.form_get_detailMap.cSum.value=22;
}
			
			else if (disVal<26000 && disVal>=20000){
			document.form_get_detailMap.cSum.value=20;				  
}
			else if (disVal<20000 && disVal>=16000){
			document.form_get_detailMap.cSum.value=18;				       }
			else if (disVal<16000 && disVal>=12000){
			document.form_get_detailMap.cSum.value=16;				       }
			else if (disVal<12000 && disVal>=8000){
			document.form_get_detailMap.cSum.value=14;				       }
			else if (disVal<8000 && disVal>=6000){
			document.form_get_detailMap.cSum.value=12;				       }	

			else{
			document.form_get_detailMap.cSum.value=10;	}}
			
			
if(document.form_get_detailMap.rdo3.checked == true){if(disVal>=26000) {
			document.form_get_detailMap.cSum.value=24;
}
			
			else if (disVal<26000 && disVal>=20000){
			document.form_get_detailMap.cSum.value=22;				  
}
			else if (disVal<20000 && disVal>=16000){
			document.form_get_detailMap.cSum.value=20;				       }
			else if (disVal<16000 && disVal>=12000){
			document.form_get_detailMap.cSum.value=18;				       }
			else if (disVal<12000 && disVal>=8000){
			document.form_get_detailMap.cSum.value=16;				       }
			else if (disVal<8000 && disVal>=6000){
			document.form_get_detailMap.cSum.value=14;				       }	

			else{
			document.form_get_detailMap.cSum.value=12;	}}
			
			
if(document.form_get_detailMap.rdo4.checked == true){if(disVal>=26000) {
			document.form_get_detailMap.cSum.value=8;
}

			else{
			document.form_get_detailMap.cSum.value=8;	}}

if(document.form_get_detailMap.rdo5.checked == true){if(disVal>=26000) {
			document.form_get_detailMap.cSum.value=19;
}
			
			else if (disVal<20000 && disVal>=16000){
			document.form_get_detailMap.cSum.value=16;				       }
			else if (disVal<16000 && disVal>=12000){
			document.form_get_detailMap.cSum.value=14;				       }
			else if (disVal<12000 && disVal>=8000){
			document.form_get_detailMap.cSum.value=12;				       }	

			else{
			document.form_get_detailMap.cSum.value=10;	}}

		
	}
</script> 

    
<script type="text/javascript">

var persistclose = 0 
var startX = 50 // ตำแหน่งแกน X จากขวา
var startY = 30 // ตำแหน่งแกน Y จากบน

function iecompattest() {
return (  document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

var verticalpos="fromtop"

function closebar() {
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}

function staticbar() {
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function ml(id) {
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.right=x "px";this.style.top=y "px";};
el.x = startX;
if (verticalpos=="fromtop")el.y = startY;
else {el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function() { if (verticalpos=="fromtop") {
	var pY = ns ? pageYOffset : iecompattest().scrollTop;
		ftlObj.y += (pY + startY - ftlObj.y)/1;
}
	else {
var pY = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
	ftlObj.y += (pY - startY - ftlObj.y)/1;
}
	ftlObj.sP(ftlObj.x, ftlObj.y);
	setTimeout("stayTopLeft()", 10);
}
	ftlObj = ml("topbar");
	stayTopLeft();
}
	if (window.addEventListener)window.addEventListener("load", staticbar, false)
	else if (window.attachEvent)window.attachEvent("onload", staticbar)
	else if (document.getElementById)window.onload=staticbar
  </SCRIPT>
  
</p>
<DIV id=topbar>
  <table border="0" cellpadding="0" cellspacing="0"  width="50%" height="120">

  <tr>
    <th width="100%">
    <A onclick="closebar(); return false" href="#"><img border="0" align="" src="Image/Windows-Close-Program-icon.png" alt="ปิด" width="16" height="16"></A></th>
  </tr>
  
  <tr>
    <th width="100%">
    <a href="" target="_blank">
    <img src="Image/document-help-icon.png" alt="help !" width="96" height="96" border="0"></a></th>
  </tr>
  </table>
 
</div>
        
<p>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});

        </script>
</p>

<br />
<table width="600" border="0" align="center">
  <tr>
    <th scope="col"><ul id="MenuBar1" class="MenuBarHorizontal"></ul>
</table>
<br />

</p>
<script type="text/javascript">
var sprytooltip1 = new Spry.Widget.Tooltip("sprytooltip1", "#sprytrigger1");
</script>


</body>
</html>


Theprat 49.230.79.xxx 09-01-2015 07:10
 ความคิดเห็นที่ 2
ลองเปลี่ยนเป็น span กำหนด id ตามค่าเดิม
 
<label id="distance_text"></label>
<label id="distance_value"></label>

หริอใช้เป็น span ก็ได้

<span id="distance_text"></span>
<span id="distance_value"></span>


ส่วนในโค้ด บรรทัด
 
$("#distance_text").val(distanceText);    
$("#distance_value").val(distanceVal);  
 
ให้เปลี่ยนจาก val เป็น text หรือ html
 
เช่น
 
$("#distance_text").html(distanceText);    
$("#distance_value").html(distanceVal);  
 
หรือ 
 
$("#distance_text").text(distanceText);    
$("#distance_value").text(distanceVal);  


ninenik 171.96.13.xxx 09-01-2015






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ