|
 |
| |
สอบถามผู้รู้ เรื่องการสร้าง "ปุ่ม" สำหรับ html javascript php |
| |
 |
|
|
 |
 |
|
กล่องข้อความเฉพาะตัวเลข
<input type="number">
เมื่อกรอกข้อมูลเสร็จ จะเกิด event onchange โดยหลังจาก กดปุ่ม return หรือ กด tab หรือคลิก นอกกล่องข้อความนั้น
<input type="number" onChange="your_function(this)" >
แสดงปุ่มกด จาก your_function(obj);
ที่เหลือก็ลอง ค้นหาเพิ่มเติมจาก google
ตัวอย่าง คำค้น
javascript: create button on runtime
|
 |
 |
 |
 |
| Date :
2020-09-18 20:43:16 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
Two-way Data Binding เหมือน Angular
Pure Javascript
Code (PHP)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Two-way dataBingding</title>
</head>
<body>
<input type=text id="myText1">
<input type=text id="myText2">
<span type=text id="myDomElement"></span>
<script>
function Binding(b) {
_this = this
this.elementBindings = []
this.value = b.object[b.property]
this.valueGetter = function(){
return _this.value;
}
this.valueSetter = function(val){
_this.value = val
for (var i = 0; i < _this.elementBindings.length; i++) {
var binding=_this.elementBindings[i]
binding.element[binding.attribute] = val
}
}
this.addBinding = function(element, attribute, event){
var binding = {
element: element,
attribute: attribute
}
if (event){
element.addEventListener(event, function(event){
_this.valueSetter(element[attribute]);
})
binding.event = event
}
this.elementBindings.push(binding)
element[attribute] = _this.value
return _this
}
Object.defineProperty(b.object, b.property, {
get: this.valueGetter,
set: this.valueSetter
});
b.object[b.property] = this.value;
}
var obj = {default:123}
var myInputElement1 = document.getElementById("myText1")
var myInputElement2 = document.getElementById("myText2")
var myDOMElement = document.getElementById("myDomElement")
new Binding({
object: obj,
property: "default"
})
.addBinding(myInputElement1, "value", "keyup")
.addBinding(myInputElement2, "value", "keyup")
.addBinding(myDOMElement, "innerHTML")
obj.default = "456";
</script>
</body>
</html>
บางเหตุการณ์จะได้ใช้
|
| |
|
|
| |
| Date :
2020-09-19 09:42:54 |
By :
freeMan |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอบคุณท่านผู้รู้ทั้ง 3 ท่านครับผม
By : Chaidhanan
By : PhrayaDev
By : freeMan
เจ๋งมากเลยครับ
|
ประวัติการแก้ไข
2020-09-19 10:12:32
| |
|
|
| |
| Date :
2020-09-19 10:12:09 |
By :
xanderkiss |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 00
|
