Question

之前我已经发布了这个问题的变体，就像我认为我已经得到它一样，它再也不起作用了。

我想出了问题，但没有回答。当我执行此代码时，它可以正常工作：

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
    for (i=0;i<=5;i++) {
        for (j=0;j<3;j++) { 
            var $eqn = "ul.side-block-content li:eq("+i+") .article-title a span";  
        }
        $($eqn).replaceWith($titleMarquee+$(this).text()+"</marquee>");
    }

但是当我输入像.mouseenter这样的事件时，它会搞砸并停止工作：

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
    for (j=0;j<3;j++) { 
        var $eqn = "ul.side-block-content li:eq("+i+") .article-title a span";  
    }
    $($eqn).mouseenter(function(){
        $($eqn).replaceWith($titleMarquee+$(this).text()+"</marquee>");
    }); 
}

我发现还有什么奇怪的问题是.event和.replaceWith都有一个变量。如果我只是将一个变量赋给.mouseenter并使用$（this）来表示.replaceWith它可以正常工作，但是限制了我的想法。我甚至不能使用（“+ i +”）。

这是我想用脚本实现的，它不会以这种方式工作。请帮忙。

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
    for (j=0;j<3;j++) { 
        $("ul.side-block-content li:eq("+i+")").mouseenter(function(){
            $("ul.side-block-content li:eq("+i+") .article-title a span").replaceWith($titleMarquee+$(this).text()+"</marquee>");
        });   
    }
}

Answer 1

这样的事情怎么样：

$("ul.side-block-content li").mouseenter(function() {
    var $this = $(this);
    var $titleMarquee =
        $('<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"></marquee>');

    $(".article-title a span", $this)
        .replaceWith($titleMarquee.text($this.text()));
});

以下是一个有效的例子：http://jsfiddle.net/mXtmB/

如果您想限制li元素，以便将事件应用于前6个：

for (var i = 0; i <= 5; i++) {
    $("ul.side-block-content li:eq(" + i + ")").mouseenter(function() {
        var $this = $(this);
        var $titleMarquee =
        $('<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"></marquee>');

        $(".article-title a span", $this)
            .replaceWith($titleMarquee.text($this.text()));
    });
}

Answer 2

我现在很难对它进行测试，检查一下是否正常。

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
var i, j; // important
for (i=0;i<=5;i++) {
    (function (i) {
        $("ul.side-block-content li:eq("+i+")").mouseenter(function(){
            $("ul.side-block-content li:eq("+i+") .article-title a span").replaceWith($titleMarquee+$(this).text()+"</marquee>");
        });   
    }(i));
}

我也删除了那个毫无意义的循环。

Answer 3

当您使用$eqn变量访问元素时，您将访问最后一个元素，因为自从您连接事件后变量的值已更改。使用this关键字访问事件所连接的元素：

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
  $("ul.side-block-content li:eq("+i+") .article-title a span").mouseenter(function(){
    $(this).replaceWith($titleMarquee+$(this).text()+"</marquee>");
  });
}

jQuery函数在JavaScript for循环中不起作用。请帮忙

3 个答案: