添加和操作元素

請參閱我的測試網站here。添加和操作元素

該腳本寫在<head>，所以你將能夠在那裏看到它。

說明

如果單擊藍色區域的新元素將會作出修改。做這個四五次。現在點擊您剛剛創建的所有元素。他們都應該有一個黑色的輪廓。但是，有些做，有些則沒有。

附加信息：

對鉻只測試爲止。

關於這裏出了什麼問題的任何想法？

來源

2011-07-12 Gary Ryan

根據創建的氣泡數量，它僅將類添加到偶數或奇數個氣泡。看看源代碼，我認爲這與刪除它之前不設置「active」類有關。 –

您正在將點擊偵聽器添加到全部氣泡每次創建一個新的氣泡。

用live偵聽器添加偵聽器一次。它可以在任何氣泡創建之前設置。

而且不要使用數字id屬性，它不被HTML所接受。

此外，您正在切換active類 - 有一個更短的功能 - toggleClass。

來源

2011-07-12 19:54:57 katspaugh

可以簡化使用此：

$(function() { 
    // CREATE A NEW BUBBLE 

    $('.drop').click(function(event){ 
    Bubble(event); 
    }); 

    var newBubbleId = 0; 
    function Bubble(event,bubbleClass){ 
    // Create Element 
    var id = newBubbleId++; 
    var bubble = $('<div class="bubble" id="b_'+id+'" draggable="true"><input id="bubbleText" type="text" name="text" value="'+id+'" /></div>'); 
    $('body').append(bubble); 

    // Position Element 
    var bubbleWidth = bubble.width(); 
    var bubbleHeight = bubble.height(); 
    var x = event.pageX - (bubbleWidth*0.5); 
    var y = event.pageY - (bubbleHeight*0.5); 
    bubble.offset({top:y, left:x}); 
    bubble.click(function() { 
     $(this).toggleClass("active"); 
    }); 
    } 

});

我看到一些其他的問題。如前所述的號碼ID。而且，所有的輸入元素都有相同的ID，這是不允許的。每個文檔只有一個ID。如果您希望它們具有相同的名稱，則可以使用Name屬性。

此外，您的計數器功能並不理想。

但是這應該可以解決你的問題。

來源

2011-07-12 20:09:33

謝謝，一個非常有效和簡單的解決方案。我知道，我的代碼在這一點上真的很sl，，會很整潔。 –

添加和操作元素

回答

相關問題