0

画像を表示するボタンが必要で、ホバーすると別の画像が表示されます。これは、link(a) と、class/onmouseover/onmouseout イベントを持つ通常の要素の両方で実行できます。リンクは URL にリダイレクトする場合にのみ使用されるため、(関数を呼び出すために) OnClick を使用する必要がある場合は、onmouse イベントで通常の要素を使用する必要があります。

問題は、ajax 呼び出しが砂丘の場合、2 つのボタンのクラス/onmouseover/onmouseout を変更する必要があり、それは大量の jquery コードになることです。

では、これをできるだけ簡単に解決するにはどうすればよいでしょうか。

4

2 に答える 2

0

atag for をonclick使用して属性を指定することもでき"javascript:void(0)"ますhref。クラスの変更は多くの jquery コードではなく、ほんの数行のコードです。

$("#elementid").attr("class","newclass")
$("#elementid").attr("onmouseover","newvalue")
$("#elementid").attr("onmouseout","newvalue")

CSS WAY

HTML:

<a href="javascript:void(0)" onclick="function()" id="idAnchor"></a>

CSS:

a#idAnchor{
display:block;
width:50px; /*width of your image*/
height:50px; /*height of your image*/
background:url("imagepath");
}

a#idAnchor:hover{
background:url("newimagepath");
}

デモはこちら

于 2012-12-29T18:18:30.507 に答える
0

AJAXが何かをどのように変更するかはよくわかりません。AJAX を介して新しいボタンを動的に生成していますか? コードを見せていただけますか？

jQuery の AJAX 関数を使用することは、それほど問題にはなりません。

$.ajax({  type: "POST",  url: "some.php",
data: { name: "John", location: "Boston" }
}).done(function( msg ) {
    // change your button classes here
    $(".button1").addClass("class1");
    $(".button1").removeClass("class2");
});

画像を変更するだけの場合は、:hover CSS 疑似クラスを使用します。これは、マウスオーバー イベントを介して実行するよりもはるかに高速です。

于 2012-12-29T20:00:43.147 に答える