เอฟเฟกต์สุดท้ายดังแสดงในรูปที่ 2 มีข้อผิดพลาด: ผลลัพธ์ของการคลิก % หลังจากจำนวนเต็มถูกต้อง หาก % ถูกคลิกหลังจากทศนิยมผลลัพธ์จะผิด! ส่วนที่เหลือเป็นเรื่องปกติโปรดให้คำแนะนำแก่ฉัน: ค่าของอินพุตเป็นประเภทสตริง จะจัดการส่วนที่ 1 อย่างถูกต้องในรูปที่ 1 ด้านล่างใน JS ได้อย่างถูกต้อง? -
รูปที่ 1
รูปที่ 2
รหัส HTML มีดังนี้
<body> <div id = "เครื่องคิดเลข"> <div> <span> เครื่องคิดเลขง่าย ๆ </span> <span> @walker </span> </div> <div id = "shuru"> <!-แถบอินพุตหน้าจอ-> <div> <อินพุตประเภท = "text" id = "screenname" type = "button" id = "7" onclick = "jsq (this.id)" value = "7"> <อินพุต type = "ปุ่ม" id = "8" onclick = "jsq (this.id)" value = "8"> <ปุ่มอินพุต = "id =" 9 " value = "back"> <input type = "ปุ่ม" id = "c" onclick = "clearnum ()" value = "c" style = "margin-right: 0px"> <! <อินพุต type = "ปุ่ม" id = "6" onclick = "jsq (this.id)" value = "6"> <อินพุต type = "ปุ่ม" id = "*" onclick = "jsq (this.id)" value = "x"> <อินพุต type = "id =" onclick = "jsq (this.id) type = "button" id = "1" onclick = "jsq (this.id)" value = "1"> <อินพุต type = "ปุ่ม" id = "2" onclick = "jsq (this.id)" value = "2"> <อินพุตประเภท = "ปุ่ม" ID = "3" onclick = "jsq (this.id)" value = "+"> <อินพุต type = "ปุ่ม" id = "-" onclick = "jsq (this.id)" value = "-" style = "margin-right: 0px"> <! onclick = "jsq (this.id)" value = "00"> <อินพุต type = "ปุ่ม" id = " onclick = "jsq (this.id)" value = "."> <อินพุต type = "ปุ่ม" id = "%" onClick = "jsq (this.id)" value = "%"> <อินพุต type = "ปุ่ม" id = "eva" onclick = "eva () <a href = "#" target = "_ blank"> คำติชม </a> </span> </div> </div> </body>
รหัส CSS มีดังนี้:
<style> /*การรีเซ็ตพื้นฐาน* /*{มาร์จิ้น: 0; Padding: 0; การปรับขนาดกล่อง: กล่องชายแดน; ตัวอักษร: 14px Arial, Sans-Serif;} HTML {ความสูง: 100%; พื้นหลังสี: Lightslategrey;}#เครื่องคิดเลข {margin: 15px auto; ความกว้าง: 330px; ความสูง: 400px; เส้นขอบ: 1px Solid Lightgray; พื้นหลังสี: Darkgrey; Padding: 15px;}/*โลโก้*/. โลโก้ {ความสูง: 20px;}. โลโก้. name {float: ซ้าย; Line-Height: 30px;}. โลโก้ .verson {float: ขวา; Line-Height: 30px;}/*หน้าจอ*/#shuru {margin-top: 15px;}. หน้าจอ {margin-top: 5px; ความกว้าง: 300px; ความสูง: 40px; TEXT-ALIGING: ถูกต้อง; Padding-Right: 10px; FONT-SIZE: 20PX;}#Keys {Border: 1PX Solid Lightgray; ความสูง: 223px; ขอบด้านบน: 25px; Padding: 8px;}#keys .last {margin-right: 0px;}. ส่วนท้าย {margin-top: 20px; ความสูง: 20px;}. ส่วนท้าย. link {float: ขวา;}#keys .buttons {float: ซ้าย; ความกว้าง: 42px; ความสูง: 36px; TEXT-ALIGN: CENTER; พื้นหลังสี: Lightgray; ระยะขอบ: 0 17px 20px 0;} </style>รหัส JavaScript มีดังนี้:
<script> var num = 0; // กำหนดข้อมูลของฟังก์ชั่นอินพุตแรก jsq (num) {// รับอินพุตปัจจุบันถ้า (num == "%") {document.getElementById ('screenname'). value = math.round (document.getElementById ('screenName'). ค่า)/100; } else {document.getElementById ('screenName'). ค่า += document.getElementById (num) .Value; }} ฟังก์ชั่น eva () {// คำนวณข้อมูลอินพุต document.getElementById ("screenName"). value = eval (document.getElementById ("screenname"). ค่า); } function clearnum () {// ล้าง 0 document.getElementById ("screenname"). value = null; document.getElementById ("ScreenName"). focus (); } function tuige () {// backspace var arr = document.getElementById ("ScreenName"); arr.value = arr.value.substring (0, arr.value.length - 1); } </script>บทความข้างต้น JavaScript ใช้เอฟเฟกต์เครื่องคิดเลขอย่างง่าย [แนะนำ] เป็นเนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น