0

ナビゲーション メニューのボタンに次のコードがあります。

div onmouseover=\"changeBGColor(this,'#b90707');changeColor(this,'#fff');\" onmouseout=\"changeBGColor(this,'');changeColor(this,'#333');\" onClick="" class='navbtn'>Entry /div

そして、要素をアクティブに保つ次のコード:

  $('.navbtn').each(function(){
    var path = window.location.href;
    var current = path.substring(path.lastIndexOf('/')+1);
    var url = $(this).attr('onClick').substring(path.lastIndexOf('/')+18,$(this).attr('onClick').length-1);

    if(url == current ){
        changeBGColor(this,'#b90707');changeColor(this,'#fff');
        $(this).onmouseout = '';
        $(this).onmouseover= '';
    };
});

要素の上にマウスを移動するまで、要素はアクティブなままです。マウスをどこに置いても、いつでもアクティブでいたい..

4

1 に答える 1

0

onmouseoutそのコードは、ハンドラーの背景色を変更しているようです。これで色が元に戻った場合は、そのイベントを処理しないで同じままかどうかを確認してください。

編集: ハンドラーを空の文字列に設定すると、正しく見えません。jQuery でイベント ハンドラーを削除する最良の方法を参照してください。

編集：

このようなものが良いかもしれません：

$(this).unbind('mouseleave');

または（上記のリンクによると、これが推奨されるアプローチです）：

$(this).off('mouseleave');

編集：

onmouseoverこれを機能させるには、およびに対して設定したインライン ハンドラを削除する必要がありますonmouseout。この理由は$(this).off('mouseleave');、イベントが jQuery で接続されていない限り機能せ$(this).onmouseover= '';ず、同じ理由でどちらも機能しないためです。

次に、いくつかの jQuery を使用してイベント ハンドラーを接続する必要があります。

$('.navbtn').mouseover(function () {
    changeBGColor(this,'#b90707'); 
});

$('.navbtn').mouseout(function () {
    changeBGColor(this, '');
});

あなたが現在行っている場所：

if(url == current ){ 
    changeBGColor(this,'#b90707');changeColor(this,'#fff'); 
    $(this).onmouseout = ''; 
    $(this).onmouseover= ''; 
};

代わりに次のことができます。

if(url == current ){ 
    changeBGColor(this,'#b90707');changeColor(this,'#fff'); 
    $('.navbtn').off('mouseout');
    $('.navbtn').off('mouseover'); 
};

これにより、設定したばかりの色がそのまま維持されるようになります。

構文が機能するには、jQuery 1.7+ が必要であることに注意してくださいoff。

于 2012-10-13T09:16:35.413 に答える