0

これは宿題で、今宣言しているだけです。

XMLを介して「クイズ」をロードし（正常に完了）、tdセルを生成（完了）して、上記の質問を表示する必要があります（未完了、代わりにデータをテストします）。

これがjavascriptのソースコードです

var selected;
var $cell;
var $cell2;
$(document).ready(function() {
    $("#getTitle").click(function() {
        selected = $("#quizname>option:selected").text();
        $("#quiztitle").html(selected+" Quiz");
        $("#quiz2").html(selected+" Quiz");
        murl = "quizdata.xml";
        $.ajax({type:"GET",
            url:murl,
            success:loaddata,
            cache:false,
            dataType:"xml",
            data:selected,
            error:ajaxerror
        });
    });
});

var $xml;
function loaddata(respobj,status,xhr) {
    //to do:
    //dynamic td creation for each xml question
    $("#questions").empty();
    $xml = $(respobj).find("quiz:contains("+selected+")");
    for (var i=0;i<$xml.attr("qnum");i++) {
        $('<tr>').attr("id","questions"+(i+1)).appendTo("#questions");

        $("<td>").attr("id","question"+(i+1)).appendTo("#questions"+(i+1));
        $("#question"+(i+1)).html((i+1)+". "+$xml.find("question[num='"+(i+1)+"']").text());
        $("#question"+(i+1)).addClass("th.thirty");

        $("<td>").attr("id","blank_question"+(i+1)).appendTo("#questions"+(i+1));
        $("#blank_question"+(i+1)).addClass("question");
        $("#blank_question"+(i+1)).html("Put Answer Here");

        $("<td>").attr("id","answer"+(i+1)).appendTo("#questions"+(i+1));
        $("#answer"+(i+1)).addClass("question");
        $("#answer"+(i+1)).html((i+1)+". "+$xml.find("answer[num='"+(i+1)+"']").text());

        $("#answer"+(i+1)).click(selectCell);
    }
}

function selectCell() {
    $cell = $(this);
    $cell.css("background-color","red");
    for (i=0;i<$xml.attr("qnum");i++) {
        $("#blank_question"+(i+1)).click(function() {
            $cell2 = $(this);
            $cell.css("background-color","lightgray");
            temp_text = $cell.text();
            temp_id = $cell.attr("id");
            $cell.attr("id",$cell2.attr("id"));
            $cell.text($cell2.attr('id'));
            $cell2.attr("id",temp_id);
            $cell2.text(temp_id);
            $("#answer"+(i+1)).unbind("click");
            $("#answer"+(i+1)).bind("click", function() {
                selectCell();
            });
        });
    }
}

function swapCell() {
    $cell.css("background-color","lightgray");
    alert($(this).attr("id"));
}

function ajaxerror(xhr,status,error) {
    $("td#desc").attr("class","");
    $("td#desc").html("xhr="+xhr);
    $("td#desc").append("<br /><br />status="+status)
    $("td#desc").append("<br /><br />error="+error);
}

私の問題は（ここで試してみてください：HomeWork Link）、最初のセルを最初にクリックしたときに、2番目のセルと交換すると機能することです。ただし、それは他のすべてのクリックとスワップでのみ機能します。シームレスにスワップする必要があるため、バインディングの問題やフォーカスの問題があると思います。コードに明らかなエラーがありますか、それとも特定のフォーカス/バインドイベントがありませんか？

ありがとう！

編集：スワッピング後に表示される値はセルID属性です

4

1 に答える 1

0

「jqueryrecursive.clickbinding」をグーグルで検索した後、.click（）の代わりに.live（）に変更したところ、完全に機能することがわかりました。

于 2013-03-04T03:11:36.283 に答える