3

我正在使用 jquery 将由 javascript 打印的购物车发送到将创建 PDF 的 PHP 脚本。

我的问题是购物车没有附加任何样式，所以它看起来像这样：http ://u31830.shellit.eu/kauppa/kuitit/kuitti63.pdf

我想简单地做一个 display:none 在一些元素上并在左边浮动一些元素，这样它看起来会很好。我知道这可以用 Attr() 来完成，但我不知道如何使用它。

这是我的ajax调用：

$(document).ready(function() {
$(function() {
    $(".submit").click(function() {
      var data = $('#yhteystiedot').serializeArray();
      //styling here?
      data.push( { name: 'cartContent', value: $('#emailedcart').html()}); // Read the cart, and send it to script
      //alert (data);return false;
     $.ajax({
    type: "POST",
    data: data,
    url: "order.php",
    dataType: "html",
    error: function(){ alert("Jotakin meni pahasti pieleen! Yritä uudelleen?");
 },
    success: function() {
 alert("Onnistui");
        }


  });
  return false;

    });
  });        
});

购物车在浏览器控制台上将如下所示：

<div class="simpleCart_items" id="emailedcart">
    <div>
        <div class="headerRow">
            <div class="item-name">Tuote</div>
            <div class="item-quantity">Määrä</div>
            <div class="item-price">Hinta</div>
            <div class="item-total">Yhteensä</div>
            <div class="item-remove"></div>
        </div>
        <div class="itemRow row-0 odd" id="cartItem_SCI-1">
            <div class="item-name">Teipit (Valkoinen hiilikuitu)</div>
            <div class="item-quantity">
                <input type="text" value="1" class="simpleCart_input">
            </div>
            <div class="item-price">48.00€&lt;/div>
            <div class="item-total">48.00€&lt;/div>
            <div class="item-remove"><a href="javascript:;" class="simpleCart_remove">Remove</a>
            </div>
        </div>
    </div>
</div>

我想在元素发送到 PHP 脚本之前将以下 css 添加到元素中

.item-remove{display:none;}
.headerRow div{float:left;}
.itemRow div{float:left;}

但是怎么做？

4

2 回答 2

1 
$(document).ready(function() {
  $(function() {
    $(".submit").click(function() {

      //do the CSS here.
      $('.item-remove').css({'display':'none'});
      $('.headerRow div').css({'float':'left'});
      $('.itemRow div').css({'float':'left'});

      var data = $('#yhteystiedot').serializeArray();
      //styling here?
      data.push( { name: 'cartContent', value: $('#emailedcart').html()}); // Read the cart, and send it to script
      //alert (data);return false;
     $.ajax({
    type: "POST",
    data: data,
    url: "order.php",
    dataType: "html",
    error: function(){ alert("Jotakin meni pahasti pieleen! Yritä uudelleen?");
 },
    success: function() {
 alert("Onnistui");
        }


  });
  return false;

    });
  });        
});

我假设您想在单击之后但在 AJAX 之前更新这些 CSS 样式。正确的？否则，只需将那些 CSS jquery 行扔到上面$(".submit").click(function() {

于 2012-09-07T16:25:08.293 回答
0

您可以使用 ajax 的 beforeSend 来做到这一点：这就是我的做法

            $.ajax({
            type: '...',
            url: '...',
            data: {
                ...
            },
            dataType: '...',
            beforeSend: function() {
                $('.item-remove').css('display','none');
                $('.headerRow div').css('float','left');
                $('.itemRow div').css('float','left');
            },
            success: function(result) {
                             ....
于 2012-09-07T16:26:59.893 回答