使用AJAX来更新页面内容。

具体示例代码：

1. 在页面上为每个变量选项创建一个按钮，将其与JavaScript函数关联：

选项1
选项2
选项3

2. 使用jQuery和AJAX获取商品信息并更新页面内容：

function updateContent() {
  var option1 = $('#option1').val();
  var option2 = $('#option2').val();
  $.ajax({
    type: 'POST',
    url: 'getProductInfo.php', // 替换为获取商品信息的页面
    data: {option1: option1, option2: option2},
    success: function(data) {
      $('#productInfo').html(data); // 替换为商品信息显示的元素
    }
  });
}

3. 在获取商品信息的页面（getProductInfo.php）中，根据传入的选项参数查询数据库并返回HTML格式的商品信息：

$option1 = $_POST['option1'];
$option2 = $_POST['option2'];
// 根据选项查询数据库，拼接HTML代码
$productInfo = '
商品名称：xxx
商品价格：xxx
';
echo $productInfo;