如何在悬停 属性 时删除带有 jquery 的提交按钮?

How to remove on hover property for a submit button with jquery?

准备好文档后,我禁用了表单提交按钮

jQuery(document).ready(function ($) {
//disable submit button

$('input[type="submit"]').prop("disabled", true);

现在取决于正在更改的文本字段 enable/disable 提交按钮

$("#codetextfield").change(function () {

        if (~$.inArray($(this).val().toLowerCase(), vouchersArr)) {

             $('input[type="submit"]').prop("disabled", false);
        } else {
            $(this).val('Non valid');   
             $('input[type="submit"]').prop("disabled", true);
        }
    });//end change

但是按钮悬停效果仍然有效,用户只是认为表单没有反应。那么如何去除按钮悬停效果呢?

我认为你的意思是 unbind 而不是删除:

$("input[type='submit']").unbind("mouseenter mouseleave");

这将完全解决悬停问题。

P.S.: 如果你想把它设置回去,你可以很容易地做到:

$("input[type='submit']").on(
    "mouseenter": function(){
        // Do something
    },
    "mouseleave": function(){
        // Do something
    }
});

EDIT 如果这对你仍然失败,你总是可以在元素上强制执行 CSS,但我建议你绑定一个 class 或一个 id添加到您的元素,使其成为解决方案的焦点。例如,假设您添加了一个 not-hoverable class。

jsFiddle

HTML

<form>
    <input type="submit" class="hoverable" value="Hoverable"></input>
    <br/><br/><br/>
    <input type="submit" class="not-hoverable" value="Not Hoverable"></input>
</form>

CSS

.hoverable {
    cursor: pointer;
}
.not-hoverable {
    cursor: arrow;
}

此变通方法可以应用于文档准备好的元素,如下所示:

$(".selector-for-the-submit-button-here").addClass("hoverable");
$(".selector-for-the-other-submit-button-here").addClass("not-hoverable");

在处理 CSS 和 WordPress 之类的东西时,如果 WordPress 与您作对,您要确保您的样式凌驾于 WordPress 之上。作为最后的手段,在 CSS 语句的末尾添加 !important 以确保您的规则将像这样工作:

.hoverable {
    cursor: pointer !important;
}
.not-hoverable {
    cursor: pointer !important;
}