0

IE9 使我的 jQuery 中的 mouseup 命令行为异常。mousedown 命令会触发，但 mouseup 命令不会。相反，用户必须双击该按钮来触发 mouseup 命令。我可以点击一下，但它会删除我喜欢的按钮效果，所以我更愿意保留它。

jQuery;

$('#voteButton').live('mousedown', function(){

   $(this).replaceWith('<img src="files/images/voting_button_active.png" width="100" height="100" alt="Vote Button" id="voteButton">');


   }).live('mouseup', function(){
   $(this).replaceWith('<img src="files/images/voting_button.png" width="100" height="100" alt="Vote Button" id="voteButton">');
    $('#votePanel').load('template/votePanel.php');




});

注意： mouseup 命令上的 replaceWith 只是为了防止 mouseup 被取消

4

2 回答 2

0

设置html元素的而不是替换整个元素似乎效果更好一些：

$('#voteButton').live('mousedown', function(){
    $(this).html('<img src="files/images/voting_button_active.png" width="100" height="100" alt="Vote Button" id="voteButton">');
}).live('mouseup', function(){
    $(this).html('<img src="files/images/voting_button.png" width="100" height="100" alt="Vote Button" id="voteButton">');
    $('#votePanel').load('template/votePanel.php');
});

显然，这将需要更改您的标记——基本上您将使用容器元素并换出内部内容。

于 2012-08-12T00:38:50.207 回答
0

Andrew 提供的 jsfiddle 在 IE9 中为我工作。您是否检查过在提供第一张图像时是否不小心将光标移动到了调整大小的 div 的范围之外？仅当您仍在 div 中时才会触发 mouse-up 事件。您可能希望附加到 mouseout 事件并在 mousedown 上设置状态，以便如果在 mousedown 处于活动状态时将鼠标移出 div，它会将 mouseout 视为 mouseup。

编辑：将 prevent default 添加到 mousedown 事件，随后的 mouseup 应该在 IE9 中适当地触发。

$(function () {
    $("#vote").live("mousedown", function () {
        event.preventDefault();
        $(this).replaceWith("<img src='http://www.placekitten.com/100/100' id='vote' />");        
    }).live("mouseup", function () {
        $(this).replaceWith("<img src='http://www.placekitten.com/200/200' id='vote' />");
    });
});​
于 2012-08-12T01:18:08.127 回答