Fatal编程技术网
  • javascript/
  • 编辑任何表单字段时显示的Javascript框

编辑任何表单字段时显示的Javascript框

javascript

编辑任何表单字段时显示的Javascript框,javascript,Javascript,我有一个表单，它有各种字段要保存到数据库中。如果这些字段中的任何一个已被编辑，我如何使警报框出现 为确保安全，如果未触摸字段，则警报框无法打开。您可以尝试在更改后的或onblur上读取事件 下面是一个简单的例子 <HTML> <HEAD> <TITLE>Example of onChange Event Handler</TITLE> <SCRIPT> function valid(input) { alert("You h

我有一个表单，它有各种字段要保存到数据库中。如果这些字段中的任何一个已被编辑，我如何使警报框出现

为确保安全，如果未触摸字段，则警报框无法打开。

您可以尝试在更改后的
或
onblur上读取事件

下面是一个简单的例子


<HTML>
<HEAD>
<TITLE>Example of onChange Event Handler</TITLE>

<SCRIPT>

function valid(input) {
    alert("You have changed the value from 10 to " + input);
}

</SCRIPT>

</HEAD>

<BODY>
<H3>Example of onChange Event Handler</H3>
Try changing the value from 10 to something else:<BR>
<FORM>
     <INPUT TYPE="text" VALUE="10" onChange="valid(this.value)">
</FORM>
</BODY>
</HTML>




onChange事件处理程序示例
函数有效（输入）{
警报（“您已将值从10更改为”+输入）；
}
onChange事件处理程序示例
尝试将值从10更改为其他值：


创建一个标志，例如：


var formUpdated = false:


将OnBlur或OnChange（取决于表单元素的类型，如textbox或checkbox）事件关联到每个表单字段


document.getElementById('#formelementId').onChange = function () {
    // check if the value has changed
    formUpdated = true;
}


将事件关联到表单的提交，例如：


  document.forms[0].onsubmit = function () { 
      if(formUpdated){
         alert('the form was updated')
      }
  }



我们最终找到了解决办法

在头部插入：


<script language="javascript" type="text/javascript" >
    var needToConfirm = false ;

    function Submit_Click() {
        needToConfirm = false; 
    }

    function setDirtyFlag() {
        needToConfirm = true; //Call this function if some changes is made to the web page and requires an alert
        // Of-course you could call this is Keypress event of a text box or so...
    }

    window.onbeforeunload = confirmExit;

    function confirmExit() {
        if (needToConfirm)
            return "You have attempted to leave this page. If you have made any changes to the fields without clicking the Save button, your changes will be lost. Are you sure you want to exit this page?";
    }
</script>




var needToConfirm=false；
函数Submit_Click（）{
needToConfirm=false；
}
函数setDirtyFlag（）{
needToConfig=true；//如果对网页进行了某些更改并且需要警报，则调用此函数
//当然，你可以称之为文本框的按键事件等等。。。
}
window.onbeforeunload=确认退出；
函数confirmExit（）{
如果（需要确认）
return“您试图离开此页面。如果您在未单击“保存”按钮的情况下对字段进行了任何更改，您所做的更改将丢失。是否确实要退出此页面？”；
}


然后在主体内，表单如下所示：


<form onunload="confirmExit()">
    <p>
        <input id="Text1" type="text"  value ="jitesh" onchange="setDirtyFlag();" /></p>
    <p>
        <input id="Checkbox1" type="checkbox" checked="checked" onchange="setDirtyFlag();"/></p>
    <p>
        <input id="Radio1" checked="checked" name="R1" type="radio" value="V1" onchange="setDirtyFlag();" /></p>
    <p>
        <input id="Submit" type="button" value="Submit" onclick="Submit_Click();"/></p>
    <p>&nbsp;
        </p>
</form>






















我们必须确保所有适用于显示确认框的字段必须具有setDirtyFlag（）的onchange答案
 这不会执行预期的操作，因为每次发生onchange事件时都会出现警报框。我只希望aler框在您退出页面时出现（即在页面卸载之前）。您知道这方面的代码吗？\n这看起来是最接近的解决方案-但是，我希望在用户离开页面（即onbeforeunload）时（而不是通过submit按钮）出现一个确认javascript框。“确认”框应仅显示为“您确定不想保存更改吗？”