โดยภาษาคอมพิวเตอร์ที่จะใช้งานในการพัฒนาเว็บไซต์ นั้นมีอยูู่มากมาย แต่ที่นิยมกันมาเลยก็จะมีอยู่นั้นก็คือ อย่างเช่น ถ้าหากต้องการจะทำให้มีการแสดงผลให้ผู้ใช้งานได้เห็นจะใช ภาษา html หรือถ้าหากต้องการจะปรับรูปแบบเพิ่มทสีสัน หรือตกแต่งสิ่งต่างๆบนหน้าเว็บไซต์มีความสวยงาม ดูดี ร่วมทั้งสามารถทีจะนำไปเเสดงยั่งอุปกรณ์ต่างๆ ที่มีจอแสดงต่างขนาดก็จะใช ภาษา css ช่วย และหากเป็นการจัดการข้อมูลนั้นหรือระบบการงานเบื่องหลังนันก็จะมีภาษาคอมพิวให้เลือกมากมาย ทั้ง php python และอีกหลายๆ
และถ้าหากต้องการที่จะสร้างลูกเล่น เพื่อเพิ่มความสนใจและอำนวยความความสะดวกกับผู้ใช้งานนั้น นั้นก็จะใช้ javascript jquery มาใช้ในการพัฒนา
ตัวอย่างโคด html
โค้ด: เลือกทั้งหมด
<div>
<form action="" name="frmMain" id="frmMain" method="post">
<label for="fname"> กรอกตัวเลข </label>
<input type="text" id="fname" name="firstname" placeholder="กรอกตัวเลข">
<label for="country">แปลงเป็น : </label>
<select id="country" name="country">
<option value="decbin">เลขฐาน 2 </option>
<option value="decoct">เลขฐาน 8 </option>
<option value="dechex">เลขฐาน 16</option>
</select>
<input type="text" id="result" name="" value="00">
<input type="submit" id="btnSend" value="Submit">
</form>
</div>
โค้ด: เลือกทั้งหมด
<style>
input[type=text], select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
input[type=submit] {
width: 100%;
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: 4px;
cursor: pointer;
}
input[type=submit]:hover {
background-color: #45a049;
}
div {
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}
</style>
โค้ด: เลือกทั้งหมด
<script src="http://code.jquery.com/jquery-latest.min.js"></script> //เรียกใช้งาน library javascrit
<script type="text/javascript">
$(document).ready(function () {
// $("#result").hide();
$("#btnSend").click(function () { //ตรวจสอบว่ามีการกดที่ปุ่มที่มี id ว่่า btnSend หรือไม
$.ajax({
type: "POST",
url: "test_php.php", //ไฟล์ที่ต้องการส่งค่าไป
data: $("#frmMain").serialize(),
success: function (result) {
var ras = result.message;
$("#result").val(ras);
}
});
});
});
</script>
บทความที่เกี่ยวข้อง
การใส่ค่าในช่อง input ด้วย javascript เพื่อจะได้มีค่าอยู่ใน textbox
ทำเอฟเฟค ตอนกดปุ่ม
คำสั่งจัดการฐานข้อมูล MySQL