javascript - 在取消对话时使选择菜单恢复

Question

我正在制作一个系统，用户可以在其中更改选择下拉菜单，它会提示他们确保他们想要采取行动。这是我的代码：

function changeResStatus(str1) {
    var id = str1;
    var status = document.getElementById("resstatus" + id).value;

    var r = confirm("Change status for ID # " + id + " to " + status + "?");
    if (r == true) {
        console.log ("change made");

    }else{
        console.log ("change not made");
    }
}

如果未进行更改，我希望选择菜单返回到用户尝试更改之前的上一个选项。我该怎么做？

标签： javascripthtml

Answer 1

请试试这个。

$(document).on('change','.mydropdown',function(){

var previousValue = $(this).attr("data-previousvalue");
var r = confirm("Change status for");
if (r == true) 
{
   $(this).attr("data-previousvalue",$(this).val())
}
else
{
   $(this).val($(this).attr("data-previousvalue"));
}
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select  class="mydropdown" data-previousvalue="0">
<option value="0">select something</option>
<option value="1">something 1</option>
<option value="2">something 2</option>
<option value="3">something 3</option>
</select>

<select  class="mydropdown" data-previousvalue="0">
<option value="0">select something</option>
<option value="101">something 101</option>
<option value="102">something 102</option>
<option value="103">something 103</option>
</select>

<select class="mydropdown" data-previousvalue="0">
<option value="0">select something</option>
<option value="201">something 201</option>
<option value="202">something 202</option>
<option value="202">something 203</option>
</select>