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 は、マウスアップがキャンセルされた場合に備えてあります。

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 にいる場合にのみ発生します。mouseout イベントにアタッチし、mousedown のステータスを設定して、mousedown がアクティブなときに div からマウスを出すと、mouseout が mouseup として扱われるようにすることができます。

編集: mousedown イベントに prevent default を追加すると、その後の 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 に答える