0

我在这里有一个站点,用户可以在其中单击一些 div。然后我使用以下代码向它添加一个“X”:

function addEx( elem, insertClass ) {
        var element = $( elem );
        var newInsertClass = insertClass.replace('.', '');
        var insert = "<span class='" + newInsertClass + "'> X </span>";

        element.click(function(){
            var $this = $(this);

            if( $this.text().indexOf( "X" ) >= 0 ) {
                var id = $this.attr( "id" );
                $( "#" + id + " " + insertClass ).remove();
            } else {
                $this.append( insert );
            }   
        })
    }

如您所见,如果“X”已经存在,我将其删除。如果它不存在,我添加它。这工作正常。

用户还可以单击“获取结果”按钮。然后将用户单击的 div 与正确答案进行比较。据此,我将类添加到正确单击、过多或忘记单击的 div 中。这也有效,但内容(“X”)会丢失。所以我可以看到我为这些类提供的 CSS-stlying,但是在用克隆替换原始内容后,div 内的“X”丢失了。为了添加类,我使用以下代码:

var test = $(".test");
var clone = test.clone(true,true);


function correction() {
    clone.children().filter(function() {
        return $.inArray('#' + this.id, forgotten) != -1;
    }).addClass("forgotten").end().filter(function() {
         return $.inArray('#' + this.id, toomuch) != -1;
    }).addClass("toomuch").end().filter(function() {
         return $.inArray('#' + this.id, correct) != -1;
    }).addClass("right");

   test.replaceWith(clone);                   
 }

我在这里克隆元素,然后在克隆上添加适当的类并用克隆替换原来的类。

所以我的问题是:如何防止这种内容丢失?我猜这是因为“X”是动态添加的?或者我还有一个以上的元素.test- 这可能是原因吗?

4

1 回答 1

1

John Resig回答了一个关于使用 jQuery 克隆对象的问题。它可能会帮助你

于 2012-07-23T14:02:42.423 回答