Question

我有HTML页面包含两个元素：输入文本和保存按钮。我需要，JQuery覆盖onclick函数。当用户单击按钮保存时，JQuery必须调用函数Validate（），如果字段验证，则调用默认函数。所以我需要，如果文本框长度不等于14则显示message-＆gt; “该字段无效！”。如果是，请调用默认功能，我需要查看alert-＆gt;“123”。但现在它不起作用。那么，这是如何解决的？

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    </head>
    <body>

    <form action="demo_form.asp">
    Phone: <input type="text" name="Phone" title="title1" value="(999) 999-9999">
    <input class="ms-ButtonHeightWidth" type="button" target="_self" accesskey="O" 
    onclick="alert('123')" value="Save" >
    </form>

    <script type="text/javascript">
    $(document).ready(function(){
    var temp = $('input[value="Save"]').click;
    $('input[value="Save"]').click(Validate);

    function Validate() {
        if ($('input[title="title1"]').val().length != 14) {
            alert("The field not valid!");
        }else {
            temp();
        }
    }
    });

    </script>

    </body>
    </html>

对不起。我没有说html。此页面在ASP上生成。事件“onclick =”alert（'123'）“”给我服务器，我不能在表单上使用Id，按钮，因为它在任何时候都不同。我只能使用值和标题，因为服务器不会更改它。我无法删除onclick。所以这就是我需要覆盖onclick的原因。

Answer 1

我认为这就是你想要的。我认为一个处理程序没有办法阻止另一个处理程序运行（你只能阻止默认操作），我甚至不确定内联处理程序的激活顺序与jQuery添加的处理程序的顺序是否相同。因此，您需要从元素中删除内联处理程序，并从验证函数中明确调用它。

$(function() {
    var old_click_handler = $('input[value="Save"]').attr('onclick');
    $('input[value="Save"]').attr('onclick', null).click(Validate);

    function Validate() {
        if ($('input[title="title1"]').val().length != 14) {
            alert("The field not valid!");
        } else {
            if (typeof old_click_handler == 'string') {
                eval(old_click_handler);
            } else {
                old_click_handler();
            }
        }
    }
});

Answer 2

为什么你必须“覆盖”这个事件？只需在事件中添加验证即可。另外，使用name而不是title来标识元素。

<input type="text" name="Phone" title="title1" value="(999) 999-9999"> <input type="button" id="myButton" /> $("#myButton").click(function() { if(Validate()) temp(); else alert("The field not valid!"); }); function Validate() { if ($("input[name=Phone]").val().length != 14) { return false; return true; } function temp() { //Do something }

Answer 3

我认为你有一个循环。您的点击处理程序会进行一些验证，但如果验证结果正常，您基本上会再次调用验证。

如果输入未验证（或使用onsubmit），我建议您改为使用表单return false并使用event.stopPropagation()。

<form id="myform">

然后：

$(document).ready(function () {
    $('#myform').submit(function (event) {
        var value = $('input[title="title1"]').val();
        if (value.length !== 14) {
            return false;
        }
     });
 });

不重写函数JQuery

3 个答案: