从jQuery发送click(）时，Web表单验证出错

Error with webforms validation when sending click() from jQuery

本文关键字：Web 表单 验证 出错 jQuery 发送 click      更新时间：2023-09-26

我开发了一个Chrome扩展，它可以在输入字段中输入数字，然后单击按钮。在目标网站开始使用WebForms验证之前，它一直运行良好（我认为）。输入值然后手动单击"确定"按钮效果良好，我如何通过编程模拟这种行为？

我的方法：

$('#valueField').val(value);
$('#okButton').click();

Javascript控制台出现异常：

Error in event handler for 'undefined': Object [object global] has no method '_ValidationSummaryOnSubmit' TypeError: Object [object global] has no method '_ValidationSummaryOnSubmit'
  at window.ValidationSummaryOnSubmit (https://secure3.skandiabanken.se/UI/Script/Core/Jquery/Validation/Validation.js?2.1.0.4:1:570)
  at Page_ClientValidate (https://secure3.skandiabanken.se/WebResource.axd?d=TQl_45lQl5IYnwb5P1nM-SzV…V9fbLp8rNqbZHpUJEW8_Ic7iJXC7haRyFmGtkyzRSo0fTQ1&t=634967428818384649:122:5)
  at WebForm_DoPostBackWithOptions (https://secure3.skandiabanken.se/WebResource.axd?d=UGn3VmeniFVT9-soGkd6Rewz…6R0Sc-xgyUag1XOlfrpjMSnBeHuqg8IzaJ1Ze5c1YwlIgE1&t=634967428818384649:14:32)
  at HTMLInputElement.onclick (https://secure3.skandiabanken.se/UI/Pages/Payment/Payments.aspx:422:831)
  at Object.f.event.trigger (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:3:3465)
  at HTMLInputElement.<anonymous> (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:3:11098)
  at Function.e.extend.each (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:2:11776)
  at e.fn.e.each (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:2:8304)
  at f.fn.extend.trigger (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:3:11074)
  at f.fn.(anonymous function) [as click] (chrome-extension://aicobpcnbdifilefkjabflphkdmjlohb/jquery-1.7.2.min.js:3:11871) event_bindings:346

编辑：从目标网站添加一些代码（但不确定要包含什么）

这是OK按钮：

<input coreValidationGroup="vgMain" coreCausesValidation="True" type="image"
name="okButton" id="okButton" class="coreMwa ShowProgressBar" src="ok.png" alt="OK"
onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;okButton&quot;, &quot;&quot;, true, &quot;vgMain&quot;, &quot;&quot;, false, false))" />

这是脚本Validation.js:

$(document).ready(function () {
    var a = {
        inputDefaultCssClass: "inputDefault",
        inputErrorCssClass: "inputError",
        checkBoxErrorCssClass: "checkBoxError",
        labelErrorCssClass: "labelError"
    };
    if (window.ValidatedTextBoxOnKeyPress && !window._ValidatedTextBoxOnKeyPress) {
        window._ValidatedTextBoxOnKeyPress = window.ValidatedTextBoxOnKeyPress;
        window.ValidatedTextBoxOnKeyPress = function () {
            return true
        }
    }
    if (window.ValidationSummaryOnSubmit && !window._ValidationSummaryOnSubmit) {
        window._ValidationSummaryOnSubmit = window.ValidationSummaryOnSubmit;
        window.ValidationSummaryOnSubmit = function (h) {
            window._ValidationSummaryOnSubmit(h);
            if (typeof Page_ValidationSummaries == "undefined") return;
            for (var f = 0; f < Page_ValidationSummaries.length; f++) {
                var c = Page_ValidationSummaries[f],
                    e = $(c).parent().parent().parent().parent().parent();
                if (e) {
                    var j = e.is(".validationSummaryContainer");
                    if (!Page_IsValid && IsValidationGroupMatch(c, h)) {
                        if (!j)
                            if ($(c).hasClass("showDividerLine")) $(c).wrap("<div class='validationSummaryContainer dividerline'><div class=validationSummary><div class=l1><div class=l2><div class=l3></div></div></div></div></div>");
                            else $(c).wrap("<div class='validationSummaryContainer'><div class=validationSummary><div class=l1><div class=l2><div class=l3></div></div></div></div></div>")
                    } else j && e.replaceWith($(c))
                }
            }
            var g;
            if (Page_Validators)
                for (i = 0; i < Page_Validators.length; i++) {
                    g = Page_Validators[i];
                    var b = $("#" + g.controltovalidate);
                    if (b) {
                        var d = $("label[for='" + b.attr("id") + "']"),
                            k = b.prop("Validators");
                        if (AllValidatorsValid && AllValidatorsValid(k)) {
                            if (!b.is("input:checkbox"))
                                if (b.hasClass(a.inputErrorCssClass)) {
                                    b.removeClass(a.inputErrorCssClass);
                                    b.addClass(a.inputDefaultCssClass)
                                }
                            if (d) d.hasClass(a.labelErrorCssClass) && d.removeClass(a.labelErrorCssClass)
                        } else {
                            if (!b.is("input:checkbox"))
                                if (!b.hasClass(a.inputErrorCssClass)) {
                                    b.removeClass(a.inputDefaultCssClass);
                                    b.addClass(a.inputErrorCssClass)
                                }
                            if (d)!d.hasClass(a.labelErrorCssClass) && d.addClass(a.labelErrorCssClass)
                        }
                    }
                }
        }
    }
})

您可以使用javascript调度事件。如果验证器检查此事件，则应执行以下操作：

//直接从MDN中提取，刚刚修改为您的ID

   function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var cb = document.getElementById("okButton"); 
  var canceled = !cb.dispatchEvent(evt);
  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}
相关文章：