Question

我使用jCart作为购物车，从jCart可以获得变量$subtotal。

但是，在更改购物车中的内容时，变量$subtotal在页面重新加载之前不会发生变化。

是否可以使用jQuery在$subtotal点击页面时更新.click(function())？

Answer 1

这个问题一开始就存在缺陷。

PHP运行服务器端。当所有PHP完成后，它将被呈现给浏览器并且所有变量都消失了。也许你回应其中的一些，所以他们在文字格式中“存在”，但是没有PHP变量可以更新。

您可以更新某些内容，例如您在PHP之前填充的javascript变量，或者由PHP设置的HTML值。这可以通过重新加载来完成，或者这可以通过使用AJAX帖子，然后使用一些PHP魔术，然后返回+赋值来完成，但是你不会替换/重新加载任何PHP变量。

在您将页面发送到浏览器后，了解再没有$subtotal 非常重要。请关注服务器端与客户端！

Answer 2

我在这里做了一个ajax帖子示例的JSFiddle（没有页面重新加载）：http://jsfiddle.net/5RjUt/1/

JQUERY

$("#button").click(function(){ // click function fired

var subtotal = $("#subtotal").val()
var dataString = 'subtotal=' + subtotal;

$.ajax({ // ajax post
    type: "POST",
    url: "YOUR_PHP_PAGE.php", // post data to this URL
    data: dataString,
    cache: false,
    success: function(html){ // this is where you can set a success callback
       $("#subtotal").val("You're new value");
    }
});
return false; // this tells the page not to refresh

)};

Answer 3

有点不清楚你想要做什么

但这里有一些建议。

使用jQuery仅更新客户端：

如果你需要更新网页上的一些可见值，假设你只需要增加或减少网页上显示的subtotal，那么你就可以使用jQuery完成这项工作，而无需任何服务器端处理。

客户端处理（Javascript / jQuery）：

var subtotal = 0;

// Add value to subtotal and update div displaying subtotal
function addToSubtotal( value ) {
    subtotal += value;
    $('#subtotal').html(subtotal);
}

// When DOM is loaded...
$(document).ready( function(){
    // Bind onclick event to every <a class="buyme">
    $('.product').on('click', 'a.buyme', null, function(e){
        // Buyme link clicked, add <span class="pricetag"> value to subtotal:
        addToSubtotal( parseInt( $(this).siblings('.pricetag').html() ));
    });
});

客户端处理（HTML）：

<div class="product">
    <a class="buyme" href="#">Add to subtotal</a><br/>
    <span class="pricetag">55</span>€
</div>
<br/>
<span id="subtotal">0</span>

或使用jQuery.ajax（）更新服务器端：

您也可以使用它来更新JS变量，尤其是在服务器检查并返回subtotal时。在这种情况下，它实际上是服务器为您返回新的小计值。

您的PHP变量$subtotal似乎是首先从某个数据存储系统中读取的，看起来它始终存在，例如在执行$myStore = new onlineStore();时最初设置它。

我假设$subtotal已经可用且包含一些一致的整数值。

AJAX更新请求代码（服务器端和客户端）：

如果正确使用，这将更新server side PHP变量，并检索它们以便与client side jQuery / Javascript一起使用。

但是，此功能不会开箱即用，只能作为完整实施的起点。

客户端处理（javascript / jquery）：

function updateSubtotalAtServer( args ) {
    $.ajax({
        type: 'POST',
        url: 'processing.php', // <= Request url
        // Add method=ajax, we use PHP to check that value
        data: $(args).serialize()+"&method=ajax",
        // processing.php returned some data:
        success: function(data){
            // Try decoding data as JSON encoded string:
            try { 
                dataobj = $.parseJSON(data);
            } catch (e) { 
                dataobj = null;
            }
            // Check if JSON return value decoded successfully:
            if (dataobj !== null) {
                // Successfully decoded JSON, log values to console.
                // ...update subtotal <span> to display it for user:
                $('#subtotal').html( dataobj.subtotal );
                console.log( dataobj );
            } else {
                // Result was not JSON string (server error).
            }
        }
    });
}

// Create new object to be used as array:
var arrayobject = new Object;
// Add this value at server side to $subtotal:
arrayobject.addtosubtotal = 55;
// Then send ajax request to server:
updateSubtotalAtServer( yourvariables or array object );

服务器端处理（php）：

// Variable that needs updating:
/* $subtotal is already available, ..read above.. */ 

if (isset($_POST['method']) && $_POST['method'] == 'ajax') {
    // Update variables:
    $subtotal += (int)$_POST['addtosubtotal'];
    // Put all data together what is needed at client side:
    $ajaxreply = array( 'subtotal' => $subtotal, 'othervalue' => 'FooBar' );
    // Return it to browser:
    echo json_encode( $ajaxreply );
    // JSON reply will fail if there is any additional output after that.
    exit;
}

更多阅读/可能有用的答案：
Another answer about jQuery.ajax, focusing on REST, forms and data arrays
Another answer about jQuety.ajax, fetch data from server

从PHP更新Javascript变量，无需重新加载页面

3 个答案: