如何确保按钮被点击甚至移动位置

时间:2014-08-20 13:47:10

标签: javascript html events

请参阅小提琴:http://jsfiddle.net/2fboubvs/5/

<input id="losefocus">
<div id="validationMessage">Text disappears when "valid"</div>
<div>
<button>Next</button>
</div>

JS:

$(function(){

    $('button').on('click', function(){
        alert('I was clicked');
    });

    $('#losefocus').on('change', function(){
        $('#validationMessage').hide();
    });
});

我的文本输入处于“错误”状态,下面是验证消息。

我输入正确的内容,当焦点仍然在文本按钮上时,我单击下一个位于输入和验证消息下面的按钮。

如果我单击按钮上的低位则不会触发点击,因为删除消息也会移动按钮。

这有什么办法吗?我想到的一种方法是稍微异步执行更改事件,以便首先单击按钮,然后更新值,然后删除消息。

然而,这将导致在按钮的单击处理程序中完成的输入值的任何读取都使用输入的先前值。

另外:注意按钮:它似乎被激活,在视觉上它获得“按下”或“活动”外观,但点击事件不会被触发。

1 个答案:

答案 0 :(得分:1)

您可以使用隐藏在消息上的可见性:然后保留文本区域而不进行回流。

    $('#validationMessage').css("visibility","hidden");