-2

我在将动态 id 插入到 JavaScript 代码中时遇到问题：

$('#scroll-up1, #scroll-down1').bind({ ..............

在这个例子中，我需要函数来获取我通过函数发送的 id 值

$('#scroll-up+id, #scroll-down+id').bind({ ..............

问题是引号作为“或'对我不起作用，我不能使用正确的函数工作正常，这个脚本让我可以滚动文本但唯一的问题是因为不允许我直接从函数的 id 发送值.

为我编辑以放置所有代码：.....

PHP AND HTML CODE

<?php

$fil_comments=file("comments.txt");

for ($i=0;$i<sizeof($fil_comments);$i++)
{

$line=explode("~",$fil_comments[$i]);

if ($i%2==0)
{
$back=1;
}
else
{
$back=2;
}

?>


<li>
<div id="web_comment_<?php echo $back?>">

<div id="web_comment_name"><?php echo $line[0];?></div>
<div class="web_comment_texto" id="scroll<?php echo $i;?>"><?php echo $line[1];?></div>
<div class="web_comment_arrow" style="margin-left:260px;" id="scroll-down<?php echo $i;?>"><img src="imagenes/comments/arrow_up.png"></div>
<div class="web_comment_arrow" style="margin-left:288px;" id="scroll-up<?php echo $i;?>"><img src="imagenes/comments/arrow_down.png"></div>

</div>
</li>


<script>
scroll_diver(<?php echo $i;?>);
</script>



<?
}

?>

JAVASCRIPT代码的功能

<script type="text/javascript">

function scroll_diver(id)
{





$(function() {




    var ele   = $('#scroll'+id);
    var speed = 30, scroll = 5, scrolling;

    $('#scroll-up'+id).mouseenter(function() {
        // Scroll the element up
        scrolling = window.setInterval(function() {
            ele.scrollTop( ele.scrollTop() - scroll );
        }, speed);
    });

    $('#scroll-down'+id).mouseenter(function() {
        // Scroll the element down
        scrolling = window.setInterval(function() {
            ele.scrollTop( ele.scrollTop() + scroll );
        }, speed);
    });


    //var a='#scroll-up'+id;
    //var b='#scroll-down'+id;


    var a='#scroll-up'+id;
    var b='#scroll-down'+id;



    //$('a,b').bind({
    //$('#scroll-up1, #scroll-down1').bind({
    //$('#scroll-up'+id+',#scroll-down'+id)

/// 这里的问题！！！

    $('#scroll-up'+id+', #scroll-down '+id).bind({



        click: function(e) {
            // Prevent the default click action
            e.preventDefault();
        },
        mouseleave: function() {
            if (scrolling) {
                window.clearInterval(scrolling);
                scrolling = false;
            }
        }
    });
});

}
</script>

基本上问题出在用于发送 id 的 JavaScript 函数行中，如果您看到 PHP 代码，我使用 bucle 来创建带有信息的滚动提示，并且每个我都可以滚动他的内容，为此我将函数调用到 bucle和：

<script>
    scroll_diver(<?php echo $i;?>);
    </script>

但是在这一行中，没有发送正确的工作信息，如果我将 bucle 用于一个特定的 id，工作正常，这个工作正常，但上下滚动非常快，并且控件没有正常工作。

4

3 回答 3

2

然后你需要看看这样的东西：

$('#scroll-up' + id + ', #scroll-down' + id).bind({ ..............

正如评论员所提到的，jQuery 选择器只是字符串。你可以把它们放在你认为合适的地方。在这种情况下，我将 id（对于最简单的示例，我假设它是一个数字或其他唯一标识符）连接到 #scroll-up 选择器，所以如果你的 id 是“1”，你最终会得到一个字符串，实际上，看起来像：

'#scroll-up1, #scroll-down1'

在字符串连接发生之后。

此外，可能值得注意的是，如果您简单地为两个对象提供相同的类，然后在绑定函数中计算出调用哪个项目并适当地执行滚动，那么您可能会获得更好的收益。

所以，如果你有：

<div class="container">
    <div id="scroll-up1" class="scroller"><!-- and code --></div>
    <div id="scroll-down1" class="scroller"><!-- and code --></div>
</div>

那么你的javascript可能看起来像这样，避免了连接的需要：

$('.container').on("mouseover",'.scroller', function(){
    var thisId = $(this).attr("id");

    if(thisId == "scroll-up1"){
        // do your up-scroll
    } else if(thisId == "scroll-down1") {
        // do your down-scroll
    }
});

请注意，它使用 .on()，它比 .bind() 更受欢迎，但其想法是基于一个公共类来处理它，而不是每次为那些绑定事件处理程序时都必须修改选择器项目。

于 2012-10-26T17:35:02.567 回答
0

推荐的解决方案：使用 CLASS NAMES for COMMON FEATURES

$('.scroll-up, .scroll-down').bind({

甚至：

$('.scroll').bind({

于 2012-10-26T17:39:09.827 回答
-1 
var id = 38;
$('#scroll-up' + id + ', #scroll-down' + id).bind({ ..............
于 2012-10-26T17:35:03.083 回答