jQuery - ChromeとSafariのオブジェクトを変更する方法

Question

divを取り、現在は隠されているクラスを追加し、ユーザーがボタンをクリックするとオブジェクトのHTMLが追加されますDOM。

これはFFとIEで動作しますが、ChromeとSafariでは動作しません。最後の2ではDOMにオブジェクトが追加されますが、表示されません。最初は隠されていましたが、 。さらに、私は特にFFで「スタイル=表示：ブロック」をdivに追加しますが、SafariやChromeでは追加しないcss（ 'display'、 'block'）を追加します。

は、ここで私は私が後で追加したいのdivのHTMLを取得するコードですが、私はクリックごとにコピーを追加します：ユーザーがクリックしたときに

ここ

var tempTicket = $('.tickets.extra:hidden').clone(); 
tempTicket.addClass('linea'); 
var ticketNombre = $('<div>').append(tempTicket.show().clone()).remove(); 

コードです：

$('#addTicket').click(function(){ 
    //Miro si los tickets anteriores están completos 
    console.log("quieres un ticket nuevo"); 
    if(checkTickets()){ 
        ticketNombre.css('display','block'); 
     $(this).before(ticketNombre.html()); 
      } 
    }); 

助けが必要ですか？ありがとう！

Answer 1

1. がやってそれらの余分.clone()と.remove()呼び出しは何ですか？ DOM属性や特性を失う可能性が.html()であなたの一時的なチケットを直列化

2. 働くことはほとんどありませんではまだない要素に.show()を呼び出す

3. 。

これを試してみてください：

var ticketNombre = $('.tickets.extra:hidden').clone().addClass('linea'); 

$('#addTicket').click(function() { 
    console.log("quieres un ticket nuevo"); 
    if (checkTickets()) { 
     ticketNombre.insertBefore(this).show(); 
    } 
}); 

Answer 2

var tempTicket = $('.tickets.extra:hidden'); 


$('#addTicket').click(function() { 
    var ticketNombre = $('<div/>').append(tempTicket.clone(true).addClass('linea').show()); 
    console.log("quieres un ticket nuevo"); 
    if (checkTickets()) { 
     ticketNombre.insertBefore(this); 
    } 
}); 

LIVE DEMO

Answer 3

が、私はスタイルでそれを修正します。

div要素が正しく挿入されたので、それは実際にそれを示したので、私はクラスに

display:block!important 

を追加しました。