内联onclick重写JQuery click()

时间:2013-07-09 16:13:20

标签: javascript jquery onclick click

this question

开始

修改

JSFiddle code

正如您所看到的,如果您运行代码,按钮文本不会更改,则onclick将覆盖单击功能。如果从函数中删除表单id属性,并从html标记中删除onclick属性,则代码按预期工作(在实际场景中,没有onclick函数意味着提交按钮而不是按钮)

结束修改

我曾经认为在指定内联事件时,错误导致JQuery没有触发click()事件,但是我再次遇到了这个问题。这是我的代码和违规标签

<input id="submit1" type="button" onclick="this.disabled=true; doSubmit();" value="submit">


<script>myfunction('submit1', 'working', myformID)</script>

var myfunction = function(ID , text , formID) {
if(ID) {
    var element = document.getElementById(ID);
    if(formID) {
        var form = document.getElementById(formID);
    }
    if (element) {
        jQuery(element).click( function() {
            if(jQuery(this).attr('disabled')) {
                return false;
            }
            jQuery(this).attr('disabled' , 'disabled');
            jQuery(this).attr('value' , processingText);
            onclick = (jQuery(this).attr('onclick') || jQuery(this).attr('onClick'));
            if(form && !onclick) {
                jQuery(form).submit();
            } 
            jQuery(this).click();
        });
    }
}
};

我正在使用javascript创建一个函数,该函数将禁用提交按钮,同时保持任何onclick属性在doSubmit的情况下工作,就像在这种情况下一样。在其他情况下,设置了表单ID并且没有现有的onclick我提交表单。因此,如果html标签存在问题,我需要一种通用的方法来解决它。

非常感谢提前

1 个答案:

答案 0 :(得分:3)

您的内联处理程序会禁用按钮:this.disabled=true;

然后jQuery处理程序检查它是否被禁用,如果是,则返回:

if(jQuery(this).attr('disabled')) {
      return false;
}

不幸的是,no way to predict the order事件处理程序在同一元素上执行同一事件。

作为快速解决方案,我可以建议:

Demo

jQuery(element).click( function() {
    if(jQuery(this).attr('disabled-by-jquery')) {
        return false;
    }
    jQuery(this).attr('disabled' , 'disabled');
    jQuery(this).attr('disabled-by-jquery' , 'disabled');
    jQuery(this).attr('value' , text);
    onclick = (jQuery(this).attr('onclick') || jQuery(this).attr('onClick'));
    if(form && !onclick) {
        jQuery(form).submit();
    } 
    jQuery(this).click();
});