Thuật toán làm bài trắc nghiệm đơn giản với Javascript + HTML

Thuật toán làm bài trắc nghiệm đơn giản với Javascript + HTML

Có thể bạn thích ?

17 bình luận trên “Thuật toán làm bài trắc nghiệm đơn giản với Javascript + HTML

  1. em đang tâp làm 1 trang web trắc nghiệm tính cách nhưng em không thể viết đươc code này. Em mày mò thì em lam được code trắc nghiệm IQ đúng sai còn code trắc nghiệm này thì em không thể nào làm được. Em mong anh giúp em :
    anh viết dùm em code php hay html thành 1 bài hoành chỉnh luôn nhé!
    em định làm trang như sau:
    câu hỏi:
    1.bạn thích màu gì?
    a.đỏ
    b.đen
    c. trắng
    d. hồng
    2. bạn thích hoa gi?
    a. hoa hồng.
    b.hoa bụt
    c. hoa loa kèn
    d.hoa cúc

    kết quả

    đóa là câu hỏi và câu trả lời
    nếu chọn a thì được 1 điểm chon b thì được 2 điểm c 3 điểm d 4 điểm..
    ở mỗi câu trả lời có nút chọn.sau khi chọn song nhấn vào kết quả
    nếu tổng số điểm nhỏ hơn hoặc bằng 2 thì đưa ra đáp án z
    nếu lớn hơn 2 nhỏ hơn hoặc bang 4 thi ra ket quả x
    nếu lớn hơn 4 nhỏ hơn hoặc bằng 6 thì ra kết quả v
    nếu lớn hơn 6 thì ra kết b
    trong đóa z là bạn là người cá tính
    x bạn là người độc lập
    v ban la người cô độc
    b bạn là người chính chắn
    các kết quả đua ra màng hình

    thật sự em rất đam mê về cái này.. nhưng kiến thức của em không thể lam được mong giúp em!em cảm ơn anh vô cùng
    các anh cứ viết bai hoành chỉnh. anh chạy thử luôn nhé!
    em xin cảm ơn

  2. Bạn copy nguyên đoạn code bên dưới rồi dán vào http://www.thichcode.net/p/test-javascrip-online.html để test với chấm điểm nhé. Ở đây mình mạc định A – B – C – D lần lượt là 1 – 2 – 3 – 4 điểm. Code có thêm biến là tong_so_diem. code khá đơn giản, bạn soi code ko hiểu thì inbox trực tiếp cho mình 🙂

    //Code by ThichCode.NET
    <div id="noi_dung_de" style='display:none;'>
    Nội dung nào sau đây thể hiện quyền bình đẳng trong lĩnh vực hôn nhân và gia đình;[Cùng đóng góp công sức để duy trì đời sống phù hợp với khả năng của mình;Tự do lựa chọn nghề nghiệp phù phợp với khả năng của mình;Thực hiện đúng các giao kết trong hợp đồng lao động;Đảm bảo quyền lợi hợp pháp của người lao động.|
    Điều nào sau đây không phải là mục dích của hôn nhân:;xây dựng gia đình hạnh phúc;củng cố tình yêu lứa đôi;tổ chức đời sống vật chất của gia đình;[thực hiện đúng nghĩa vụ của công dân đối với đất nước
    </div>
    <script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'></script>
    <script>
    //CODE BY THICHCODE.NET
    var nd = $("#noi_dung_de").html();
    var cau_hoi = nd.split('|');
    var html = ""; var tra_loi_dung = 0;
    for(var i = 0;i<cau_hoi.length;i++)
    {
    var chi_tiet = cau_hoi[i].split(';');
    //alert(chi_tiet[i]);
    for(var j=0;j<chi_tiet.length;j++)
    {

    if (j==0) html += "<tr><td><b>Câu " + (i+1) + ":</b></td><td> <b>" + chi_tiet[j].trim() + "</b></td></tr>";
    else
    {
    html += "<tr><td></td><td id='" + (i + 1 + String.fromCharCode(64 + j)) + "'><input type='checkbox' name='" + (i + 1 + String.fromCharCode(64 + j)) + "' value='" + chi_tiet[j].trim() +"'> " + String.fromCharCode(64 + j) + ". " + chi_tiet[j].replace("[","").trim() + "</td></tr>";
    }
    }
    }

    $("#noi_dung_de").empty().append("<table>" + html + "</table><input type='submit' value='Trả lời xong' id='tra_loi_xong'>").fadeIn();
    $("#noi_dung_de input").click(function(){
    //Lấy tên của checkbox
    var id = $(this).attr("name");

    //Đổi màu nền câu trả lời

    if ($(this).is(":checked")) $("td#" + id).css("background-color","yellow");
    else $("td#" + id).css("background-color","");
    });

    var tong_so_diem = 0;
    $("#tra_loi_xong").click(function(){
    $('#noi_dung_de input').each(function () {
    var id = $(this).attr("name");
    var ctl = $(this).val();

    //Hiển thị câu đúng với nền là màu đỏ
    if (ctl[0] == '[')
    {
    //alert($("td#" + id).css("background-color"));
    if ($("td#" + id).css("background-color") == "rgb(255, 255, 0)")
    {
    tra_loi_dung++;
    var char_first = $("td#" + id).text().trim().substring(0,1);
    switch(char_first)
    {
    case 'A': {tong_so_diem += 1; break; }
    case 'B': {tong_so_diem += 2; break; }
    case 'C': {tong_so_diem += 3; break; }
    case 'D': {tong_so_diem += 4; break; }
    default: {break;}
    }
    }
    else
    {
    $("td#" + id).css("background-color","red");
    }
    }
    });
    $("#noi_dung_de").append("<p>Trả lời đúng :" + (tra_loi_dung < 0 ? "0" : tra_loi_dung) + " câu</p>");
    $("#noi_dung_de").append("<p>Số điểm của bạn là : " + tong_so_diem + "</p>");
    $("#tra_loi_xong").fadeOut();
    });
    </script>

  3. Code hay tuyệt. Bạn giúp cho code thêm các tính năng:
    1. Mỗi câu hỏi chỉ có 1 phương án đúng, nếu chọn từ 2 phương án trở lên là bị loại ( 0 điểm )
    2. Thêm giới hạn thời gian, chẳng hạn hết 45 phút thì báo hết giờ, không cho trả lời nữa

    Xem Demo của mình vì môn toán nên phải dùng hình ảnh bị lặp "Câu số" http://anhlevan.weebly.com/gt12c3_de01.html

  4. Bác cho em hỏi, giờ em muốn làm bài trác nghiệm theo form của bác, nhưng muốn ẩn đáp án ở dưới mỗi câu hỏi, sau khi người làm ấn trả lời xong Đáp án mới hiện ra thì làm như nào ạ? Với cả nếu muốn chọn mỗi câu chỉ được chọn 1 đáp án thì sẽ làm như nào vậy ạ?
    Em cảm ơn trước!

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *


Liên Hệ

Tp Mỹ Tho, Tiền Giang

0919 344 644