Question

这是为了检查用户是否正在打开另一个div（表单;页面有四个），而没有保存当前表单的条目或更新。

我需要将下拉列表的当前值与下拉列表的所有可能选项进行比较。如果存在差异，则向用户显示通知未保存数据的警报。没有一定数量的下拉菜单。我的脚本已经能够正确计算每个表单的下拉数量。

谢谢，

詹姆斯

Answer 1

我要做的是：

每当发生更改时（您可以附加到需要跟踪的任何表单元素的onChange事件），请在某处设置一个标志，指示表单（或其他）是“脏”。（把它放在data- attributes）
保存表单后，保存过程可以重新设置脏标志以清除
无论使用何种方法切换表单，都可以先检查是否设置了脏标志，如果是，则显示错误（或警告）并阻止显示下一个表单。

有了这3个部分，您应该能够轻松检测到脏（未保存）的表单并采取适当的措施。

Answer 2

您可以通过更改选择更改时的变量来执行此操作，然后在执行操作时检查该值以转到下一个表单。这是我嘲笑的代码：

HTML -

<select id="one">
    <option value=""></option>
    <option>1</option>
    <option>2</option>
</select>
<br />
<select id="two">
    <option value=""></option>
    <option>3</option>
    <option>4</option>
</select>
<br />
<select id="three">
    <option value=""></option>
    <option>5</option>
    <option>6</option>
</select>
<br />
<!-- The submit buttons -->
<input type="submit" id="submit" value="Save" />
<br />
<!-- The link that moves on to the next form -->
<a href="#" id="moveOn">Move on</a>

Javascript -

// the variable
var selectChanged = false;
// set up everything on load
window.onload = function() {

    // bind handlers to submit button, link, an dselects
    document.getElementById("submit").onclick = submitForm;
    document.getElementById("moveOn").onclick = moveOn;

    var selects = document.getElementsByTagName("select");
    var numSelects = selects.length;
    for (var i = 0; i < numSelects; i++) {
        selects[i].onchange = noteChanged;
    }
}

function submitForm() {
    // set the changed variable to false
    selectChanged = false;
}

function moveOn() {
    // if the select has changed without save, alert the user and prevent
    // link actions
    if (selectChanged) {
        alert("You have changed a form value but not saved it");
        return false;
    }
}

// update the value for each time a select changes
function noteChanged() {
    selectChanged = true;
}

Here it is正在行动

获取dropdownlist的所有值，以查看是否已使用javascript更改了加载的值

2 个答案: