表单重置后,js checkValidity()不再正常运行

时间:2019-01-15 21:32:19

标签: javascript html validation internet-explorer

IE11问题,​​在其他浏览器中也可以使用(如图)。

我有一个带有一组单选按钮的表单。

单选按钮具有checkValidity()属性

当我加载页面并在表单上运行false函数时,它将返回checkValidity()这是正确的。

我选中一个单选按钮。我在表单上运行true函数,它返回checkValidity()这是正确的。

当我单击重置输入按钮时,它清除了我的单选按钮选择,但是,当我在表单上运行true函数时,它将返回label { display: block; margin-bottom: 20px; }这是不正确的。

这违反了HTML规范。 (请参阅https://www.w3.org/TR/html52/sec-forms.html#value-sanitization-algorithm

这种行为仅在IE中发生,对此有任何想法吗?

我在下面添加了一个代码片段,并提供了我的问题的示例。

<form id="foo">

  <label><input type="radio" name="xx" value="This" required> This</label>
  <label><input type="radio" name="xx" value="That" required> That</label>
  <label><input type="radio" name="xx" value="other" required> Other  </label>

  <input type="reset" value="Reset Button">
  <input type="button" value="JS Reset Form" onClick="this.form.reset()" />
  <input type="button" value="Is Valid?" onClick="alert(this.form.checkValidity())" />
  
</form>
void EchoLastError()
{
    std::string ToExecute;
    std::stringstream Command;
    Command << "echo " << GetLastError();
    ToExecute = Command.str();
    system(ToExecute.c_str());
    Command.str(std::string());
}
BOOL CreateRemoteThreadInject(DWORD IDofproc, const char * dll)
{
    HANDLE Process;
    LPVOID Memory, LoadLibrary;
    if (!IDofproc)
    {
        return false;
    }
    Process = OpenProcess(PROCESS_CREATE_THREAD | PROCESS_QUERY_INFORMATION | PROCESS_VM_READ | PROCESS_VM_WRITE | PROCESS_VM_OPERATION, FALSE, IDofproc);

    EchoLastError();

    system("pause");
    LoadLibrary = (LPVOID)GetProcAddress(GetModuleHandle("kernel32.dll"), "LoadLibraryA");

    Memory = (LPVOID)VirtualAllocEx(Process, NULL, strlen(dll) + 1, MEM_RESERVE | MEM_COMMIT, PAGE_READWRITE);

    WriteProcessMemory(Process, (LPVOID)Memory, dll, strlen(dll) + 1, NULL);

    CreateRemoteThread(Process, NULL, NULL, (LPTHREAD_START_ROUTINE)LoadLibrary, (LPVOID)Memory, NULL, NULL);
    EchoLastError();
    CloseHandle(Process);

    VirtualFreeEx(Process, (LPVOID)Memory, 0, MEM_RELEASE);
    EchoLastError();
    MessageBox(NULL, "Injected", "", MB_OK);

    return true;
}



//other
bool Injectstuff(DWORD processId, char* dllpath)
{
    std::stringstream kds;
    kds << "echo Process ID: " << processId;
    std::string dl = kds.str();
    system(dl.c_str());
    EchoLastError();
    HANDLE hTargetProcess = OpenProcess(PROCESS_ALL_ACCESS, false, processId);
    EchoLastError();
    system("pause");
    if (hTargetProcess)
    {
        LPVOID LoadLibAddress = (LPVOID)GetProcAddress(GetModuleHandleA("kernel32.dll"), "LoadLibraryA");
        EchoLastError();
    system("pause");
        LPVOID LoadPath = VirtualAllocEx(hTargetProcess, 0, strlen(dllpath), MEM_COMMIT | MEM_RESERVE, PAGE_READWRITE);
        EchoLastError();
    system("pause");
        HANDLE RemoteThread = CreateRemoteThread(hTargetProcess, 0, 0, (LPTHREAD_START_ROUTINE)LoadLibAddress, LoadPath, 0, 0);
        EchoLastError();
    system("pause");
        WaitForSingleObject(RemoteThread, INFINITE);
        EchoLastError();
    system("pause");
        VirtualFreeEx(hTargetProcess, LoadPath, strlen(dllpath), MEM_RELEASE);
        EchoLastError();
    system("pause");
        CloseHandle(RemoteThread);
        CloseHandle(hTargetProcess);
        return true;
    }
    return false;
}

2 个答案:

答案 0 :(得分:1)

IE 10/11仅具有partial support of validity check,并且重置不会触发IE11中的验证(可能是错误)。您必须手动进行:

function resetForm(form) {
 form.reset();
 // re-set any input value, it forces IE to re-validate form
 var input = form.querySelector('input, select');
 input.value = input.value;
}
label {
  display: block;
  margin-bottom: 20px;
}
<form id="foo">

  <label><input type="radio" name="xx" value="This" required> This</label>
  <label><input type="radio" name="xx" value="That" required> That</label>
  <label><input type="radio" name="xx" value="other" required> Other  </label>

  <input type="button" value="JS Reset Form" onClick="resetForm(this.form)" />
  <input type="button" value="Is Valid?" onClick="alert(this.form.checkValidity())" />
  
</form>

答案 1 :(得分:0)

根据bigless的回复,我认为您可以创建一个JavaScript验证函数来验证表单,因此,可以使用reset type按钮和“ this.form.reset()”, 代码如下:

<style type="text/css">
    label {
        display: block;
        margin-bottom: 20px;
    }
</style>

<script type="text/javascript">
    function validityForm(form) {
        var input = form.querySelector('input, select');
        input.value = input.value;
        alert(form.checkValidity());
    }
</script>
<form id="foo">

    <label><input type="radio" name="xx" value="This" required> This</label>
    <label><input type="radio" name="xx" value="That" required> That</label>
    <label><input type="radio" name="xx" value="other" required> Other  </label>

    <input type="reset" value="Reset Button">
    <input type="button" value="JS Reset Form" onClick="this.form.reset()" />
    <input type="button" value="Is Valid?" onClick="validityForm(this.form)" />
</form>