Javascript 更改上的变量整数。单击“与.加载耦合”

我试图根据单击的按钮更改一个变量，然后更新一个div，所有这些都使用AJAX来防止页面刷新

index.php

    <div id="value1"></div>

    <div id="main-content">
      <?php include 'page1.php'; ?>
    </div>

因此，按照逻辑，index.php将在“value1”div中加载值为15的page1.php。单击“加载页面2”按钮后，page2.php将加载到“main content”div中，同时将“value1”div中的值增加1

它没有这样做，我也不知道该怎么做。感谢所有的帮助

---

谢谢。

首先，在

文档中，
workoutVal
是否应该是
valueAdd

在
valueAdd
变量和
value1
div的innerHTML之间没有持久链接。当您最初分配
value1
的innerHTML值时，您只在该特定时间点为其分配
value1
的值。您没有将这两者耦合在一起，变量中的值的更改将自动传播到div中的更改（然而，在许多现代JavaScript框架中，例如：AngularJS中，这是常见的做法）

如果您希望在单击按钮时更新
value1
div，则必须在代码中明确执行此操作：

$(document).ready(function(){
    $('#button1').click(function(){
        valueAdd++;
        document.getElementById("value1").innerHTML = valueAdd;
        $('#main-content').load('page2.php').hide().fadeIn('slow');
    });
    $('#button2').click(function(){
        valueAdd++;
        document.getElementById("value1").innerHTML = valueAdd;
        $('#main-content').load('page3.php').hide().fadeIn('slow');
    });
});

感谢您对变量的关注。你说得对。我做了编辑以反映情况。不幸的是，在添加建议的代码行后单击时，它不会更改“value1”div中显示的值。然后，我也对其进行了更改，以简单地替换该值（valueAdd=20；），单击后，它发生了更改，但很快又返回到其原始值（15）。想法？@Kylehier回调函数中缺少右括号和圆括号。请查看我在回复底部链接的示例。感谢您的帮助@Lloyd Banks。非常感谢
<script src="click.js"></script>

      <button id="button2">Load Page 3</button>

var valueAdd = 15;
document.getElementById("value1").innerHTML = valueAdd;

$(document).ready(function(){
    $('#button1').click(function(){
        valueAdd ++;
        $('#main-content').load('page2.php').hide().fadeIn('slow');

    $('#button2').click(function(){
        valueAdd ++;
        $('#main-content').load('page3.php').hide().fadeIn('slow');
})

$(document).ready(function(){
    $('#button1').click(function(){
        valueAdd++;
        document.getElementById("value1").innerHTML = valueAdd;
        $('#main-content').load('page2.php').hide().fadeIn('slow');
    });
    $('#button2').click(function(){
        valueAdd++;
        document.getElementById("value1").innerHTML = valueAdd;
        $('#main-content').load('page3.php').hide().fadeIn('slow');
    });
});