jQuery - 如何更改 Chrome 和 Safari 的对象

发布于 2025-01-01 12:17:15 字数 850 浏览 0 评论 0原文

我有一个片段,它采用当前隐藏的 div,它添加一个类,然后当用户单击按钮时将对象的 HTML 添加到 DOM。

它可以在 FF 和 IE 中工作,但不能在 Chrome 和 Safari 中工作,在最后两个中,它将对象添加到 DOM 但不显示,就像我说的,它在开始时是隐藏的,但我添加的类使其可见。更重要的是,我专门添加了 css('display', 'block'),它在 FF 中向 div 添加了“style=display:block”,但在 Safari 和 Chrome 中则没有。

这是我获取稍后要添加的 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());
            }
     });

有帮助吗?谢谢!

I have a snippet that that takes a div, that is currently hidden, it adds a class and then when a user clicks on a button adds the HTML of the object to the DOM.

It works in FF and IE, but not in Chrome and Safari, in these last 2 it adds the object to the DOM but it doesnt display, like I said it's hidden at the start but the class I add makes it visible. Even more I specifically add css('display', 'block'), which in FF adds a "style=display:block" to the div but not in Safari and Chrome.

Here's the code where I get the HTML of the div I want to add later, I will add a copy for each click:

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

Here's the code when the user clicks:

    $('#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());
            }
     });

Any help? thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

你对谁都笑 2025-01-08 12:17:15
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);
    }
});

现场演示

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

赤濁 2025-01-08 12:17:15

我通过样式修复它。

由于 div 已正确插入,我将其添加

display:block!important

到类中,因此它实际上显示了它。

I fix it by styles.

Since the div was inserted correctly i added

display:block!important

to the class so it actually showed it.

や三分注定 2025-01-08 12:17:15
  1. 那些额外的 .clone().remove() 调用在那里做什么?

  2. 在尚未包含在 DOM 中的元素上调用 .show() 不太可能起作用

    在已包含在 DOM 中的

  3. 使用 .html() 序列化您的临时票证可能会丢失属性。

试试这个:

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

$('#addTicket').click(function() {
    console.log("quieres un ticket nuevo");
    if (checkTickets()) {
        ticketNombre.insertBefore(this).show();
    }
});
  1. What are those extra .clone() and .remove() calls doing there?

  2. Calling .show() on an element that isn't yet in the DOM is unlikely to work

  3. serialising your temporary ticket with .html() could lose attributes or properties.

Try this:

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

$('#addTicket').click(function() {
    console.log("quieres un ticket nuevo");
    if (checkTickets()) {
        ticketNombre.insertBefore(this).show();
    }
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文