Javascript 如何在按下按钮时更新变量？

这里有一些带有jQuery和AJAX的JavaScript

点击按钮时，应向用户提供与1到6之间的随机数相对应的模具图像。这里发生的事情是，

结果

只被计算一次（在页面加载时），并且每次单击按钮时都不会更新，这就是为什么每次都会得到相同的滚动结果。我怎样才能达到我想要的结果

$(document).ready(function () {        
  $('.roll').click(function(e){
    e.preventDefault();
    $.ajax({
        type: 'POST',
        url: '/rolls',
        data: result,
        success: function() {
            $('h1').replaceWith('<h1>Rolled</h1>');
            $('#die').replaceWith(image)
        }
    })
  });   
  result = Math.floor(Math.random() * 6) + 1;
  image = "<img src='" + result + ".png' alt='yoo'>";   
});

$（文档）.ready（函数（）{
$（'.roll'）。单击（函数（e）{
e、 预防默认值（）；
$.ajax({
键入：“POST”，
url:“/rolls”，
数据：结果，
成功：函数（）{
$（'h1'）。替换为（'Rolled'）；
$（'#die'）。替换为（图像）
}
})
});   
结果=Math.floor（Math.random（）*6）+1；
image=“”；
});

重新计算必须在单击处理程序中完成，但必须在ajax调用之前完成

$(document).ready(function () {
    $('.roll').click(function(e){
        e.preventDefault();
        var result = Math.floor(Math.random() * 6) + 1;
        var image = "<img src='" + result + ".png'";
        $.ajax({
            type: 'POST',
            url: '/rolls',
            data: result,
            success: function() {
                $('h1').replaceWith('<h1>Rolled</h1>');
                $('#die').replaceWith(image)
            }
        })
    })
    .trigger('click');
 });

$（文档）.ready（函数（）{
$（'.roll'）。单击（函数（e）{
e、 预防默认值（）；
var result=Math.floor（Math.random（）*6）+1；
var image=“Rolled”）；
$（'#die'）。替换为（图像）
}
})
})
.trigger（'click'）；
});

您需要移动这些行

结果=Math.floor（Math.random（）*6）+1； image=“”

到ajax成功函数的开头。您现在编写它的方式不是单击函数的一部分

---

还要在单击函数之前添加var result=“default.png”

谢谢您的回答！但是它不起作用。在控制台中获取此错误：“未捕获引用错误：未定义结果”您需要在ajax调用之前初始化

结果

（否则它将未定义）我该怎么做呢，Steven？我真的很难掌握JS和ajax的诀窍只要把行

var result=Math.floor（Math.random（）*6）+1；

移到

$.ajax（{

（加上@Stephen前缀注释，我明白了）前面的行就行了！谢谢！