2.โจทย์ตัวเลือก จากโจทย์เดิม

1. <style>
2. div#quest{
3. font-weight : bold;
4. color : blue;
5. }
6. input:checked+label {
7. background-color : yellow;
8. }
9. </style>
10. <input type="button" value="แสดงโจทย์และตัวเลือก" onclick="disp_question(q.randQ())"><br>
11. <div id="quest">โจทย์</div>
12. <input type="radio" id="r1" name="choice"><label id="c1" for="r1">ตัวเลือก 1</label><br>
13. <input type="radio" id="r2" name="choice"><label id="c2" for="r2">ตัวเลือก 2</label><br>
14. <input type="radio" id="r3" name="choice"><label id="c3" for="r3">ตัวเลือก 3</label><br>
15. <input type="radio" id="r4" name="choice"><label id="c4" for="r4">ตัวเลือก 4</label><br>
16. <input type="button" value="ตรวจคำตอบ" onclick="check_ans()">
17. <div id="out">แสดงผลคำตอบ</div>
18. <script>
19. function Rand(a) {
20. this._original = a;
21. this._value = new Array();
22. }
23. Rand.prototype._create = function() {
24. this._value = this._original.clone();
25. this._value.shuffle();
26. }
28. Rand.prototype.shift = function() {
29. if (this._value.length==0)
30. this._create();
31. return this._value.shift();
32. }
33. Array.prototype.clone = function() {
34. var t = new Array;
35. for (var i = 0; i < this.length; i++) {
36. t.push(this[i]);
37. }
38. return t;
39. }
41. Array.prototype.shuffle = function() {
42. var i = this.length, j, temp;
43. if ( i == 0 ) return this;
44. while ( --i ) {
45. j = Math.floor( Math.random() * ( i + 1 ) );
46. temp = this[i];
47. this[i] = this[j];
48. this[j] = temp;
49. }
50. return this;
51. }
52. </script>
53. <script>
54. String.prototype.format = function() {
55. var str = this.toString();
56. if (!arguments.length)
57. return str;
58. var args = typeof arguments[0],
59. args = (("string" == args || "number" == args) ? arguments : arguments[0]);
60. for (arg in args)
61. str = str.replace(RegExp("\\{" + arg + "\\}", "gi"), args[arg]);
62. return str;
63. }
64. </script>
65. <script>
66. var q = {
67. "quest" : "{w1}มีเหรียญ {v1} บาท จำนวน {v2} เหรียญ คิดเป็นเงินกี่บาท",
68. w1 : new Rand(["มานะ", "มานี", "สมชาย", "สมหญิง", "ประยุทธ"]),
69. v1 : new Rand([5,10,20]),
70. v2 : new Rand([2,3,4,6]),
71. choice : [
72. [function(v1,v2) { return v2+v1; }, "ผิด"],
73. [function(v1,v2) { return v2*v1; }, "ถูก"],
74. [function(v1,v2) { return v2/v1; }, "ผิด"],
75. [function(v1,v2) { return Math.abs(v2-v1); }, "ผิด"]
76. ],
77. randQ : function () {
78. var w1 = this.w1.shift();
79. var v1 = this.v1.shift();
80. var v2 = this.v2.shift();
81. this.q = {};
82. this.q.question = this.quest.format({
83. w1 : w1,
84. v1 : v1,
85. v2 : v2
86. });
87. this.q.choice = new Array();
88. for(var i=0; i<4; i++) {
89. this.q.choice[i] = new Array();
90. this.q.choice[i][0] = this.choice[i][0](v1,v2);
91. this.q.choice[i][1] = this.choice[i][1];
92. }
93. q.choice.shuffle();
94. return this.q;
95. }
96. }
98. function disp_question(q) {
99. var a = document.getElementById("quest");
100. a.innerHTML = q.question;
101. //var a = document.getElementById("c1");
102. //a.innerHTML = q.choice[0];
103. for (var i=0;i<4 ; i++)
104. {
105. var a = document.getElementById("c"+(i+1));
106. a.innerHTML = q.choice[i][0];
107. }
108. }
110. function check_ans() {
111. var out = document.getElementById("out");
112. out.innerHTML = "ถูกต้อง หรือ ไม่ถูก ยังไม่รู้ต้องลองทำดู";
113. }
114. </script>

randomQuiz.1

1. เปลี่ยนโจทย์อย่างน้อย 2 ตำแหน่ง หรือมากกว่า แต่ต้องมี คำคงที่ 1 คำแหน่ง และตัวแปร 1 ตำแหน่ง
   • คำคงที่ ที่ไม่มีผลกับคำตอบ เช่น มานะ, มานี, สมชาย, สมหญิง หรือ ประยุทธ
   • ตัวแปร ที่มีผลกับคำตอบ
2. <div id="out"><div>
3. <script>
4. String.prototype.format = function() {
5. var str = this.toString();
6. if (!arguments.length)
7. return str;
8. var args = typeof arguments[0],
9. args = (("string" == args || "number" == args) ? arguments : arguments[0]);
10. for (arg in args)
11. str = str.replace(RegExp("\\{" + arg + "\\}", "gi"), args[arg]);
12. return str;
13. }
14. var a = document.getElementById("out");
15. a.innerHTML = "สวัสดี {time} คุณ {w0} ".format({w0:"สมชาย", time:"ตอนเช้า"});
16. </script>

ปัญหาที่พบ

A - คำถาม มี 2 คำถาม

B - แต่ละตัวเลือก มีคำตอบเดียว

A - เมื่อคลิกแสดงโจทย์ และตัวเลือกใหม่

ฺB - เมื่อคลิกแสดงโจทย์ และตัวเลือกใหม่ แล้ว

• ตัวเลือกที่เคยเลือก ควรถูกยกเลิก
• การตรวจคำตอบที่ผ่านมา ควรเปลี่ยนเป็นคำใหม่ที่เหมาะสม

• ตัวเลือกที่ผิด อาจคำนวณได้ผลตรงกับคำตอบที่ถูก