-1

これは私のコードで、:eq(15) まで繰り返します。私は一般的にjQueryとJavaScriptに不慣れで、これを正しく行っているとは思えません。このコードをループにクリーンアップするのを手伝ってくれる人はいますか? :eq(0) を 15 まで 1 ずつ増やすには、基本的にこのスクリプトが必要です。

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"><span>';

$("ul.side-block-content li:eq(0)").mouseenter(function(){$('ul.side-block-content li:eq(0) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(0) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(0)").mouseleave(function(){$('ul.side-block-content li:eq(0) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(0) .article-title a').text()+'</span>');});  

$("ul.side-block-content li:eq(1)").mouseenter(function(){$('ul.side-block-content li:eq(1) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(1) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(1)").mouseleave(function(){$('ul.side-block-content li:eq(1) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(1) .article-title a').text()+'</span>');});  

$("ul.side-block-content li:eq(2)").mouseenter(function(){$('ul.side-block-content li:eq(2) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(2) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(2)").mouseleave(function(){$('ul.side-block-content li:eq(2) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(2) .article-title a').text()+'</span>');});  

$("ul.side-block-content li:eq(3)").mouseenter(function(){$('ul.side-block-content li:eq(3) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(3) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(3)").mouseleave(function(){$('ul.side-block-content li:eq(3) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(3) .article-title a').text()+'</span>');});

$("ul.side-block-content li:eq(4)").mouseenter(function(){$('ul.side-block-content li:eq(4) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(4) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(4)").mouseleave(function(){$('ul.side-block-content li:eq(4) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(4) .article-title a').text()+'</span>');});

$("ul.side-block-content li:eq(5)").mouseenter(function(){$('ul.side-block-content li:eq(5) .article-title a span').replaceWith($titleMarquee+$('ul.side-block-content li:eq(5) .article-title a').text()+'</span></marquee>');});

$("ul.side-block-content li:eq(5)").mouseleave(function(){$('ul.side-block-content li:eq(5) .article-title a marquee').replaceWith('<span>'+$('ul.side-block-content li:eq(5) .article-title a').text()+'</span>');});

前もって感謝します。

4

3 に答える 3

1 
for (i = 1; i <= 15; i++) {
    $("ul.side-block-content li:eq(" + i + ")").mouseenter(function() {
        var $this = $(this);
        $this.filter('.article-title a span').replaceWith(
        $titleMarquee + $this.filter('.article-title a').text() + '</span></marquee>');
    }).mouseleave(function() {
        var $this = $(this)
        $this.filter('.article-title a marquee').replaceWith('<span>' + $this.filter('.article-title a').text() + '</span>');
    });
}

PSこれがうまくいくかどうかわかりません-あなたのHTMLを見る必要があります。<span>($titleMarquee に何が入っているのか、最初の置換で開始がない理由がわからない)

于 2011-04-18T07:40:01.273 に答える
0

これらのステートメントはすべて、リスト項目が異なるだけで同じことをしているように見えます。それが正しいと仮定すると、これを行うことができます：

$("ul.side-block-content li").hover(
    function(){
        var link = $(this).find(".article-title a"),
            span = link.find("span");
        span.replacewith($titleMarquee + link.text() + '</span></marquee>');
    },
    function(){
        var link = $(this).find(".article-title a"),
            marquee = link.find("marquee");
        marquee.replaceWith('<span>' + link.text() + '</span>');
    }
);

hovermouseenter関数をおよびに接続するためのショートカットですmouseleave。各関数内でthisは、要素自体が参照されるため、li要素を jQuery オブジェクトでラップすると、findその子孫を見つけるために使用できます。主にリンクのコンテンツを操作しているように見えるため、コードはそのリンクを見つけてからspan(on mouseenter) またはmarquee( on ) を見つけ、リンク テキストを含むaまたは amouseleaveに置き換えます。marqueespan

于 2011-04-18T07:58:41.603 に答える
0

これを試して：

$('ul.side-block-content').delegate('li', 'mouseleave', function() {
    $a = $(this).find('.article-title a');
    $a.filter('span:first').replaceWith($titleMarquee + $a.text()
                                        + '</span></marquee>');
});
于 2011-04-18T07:58:48.970 に答える