1

我有一段简单的 PHP，它生成以下代码的n 个副本：

<p class="ShowSDB_L2" class="center" onClick="FSD_L2('<?php print dbG;?>','<?php print $sLID;?>')">Click Here to See Data</p>   
<div class="divSDB_L2">
</div>

它是使用 PHP 生成的，因此事先不知道副本的数量。

在另一个页面上，我有以下 Javascript（使用 jQuery）

function FSD_L2(dbG,SlID)
    {
        $(".divSDB_L2").load("test15.php?dbG="+dbG+"&SlID="+SlID).css('display','block');
    }

单击上面的文本（单击此处查看数据）时，应在两个 DIV 标记之间添加 test15.php 的内容。

#Test15.php
<?php
$dbG = $_GET['dbG'];
$SlID = $_GET['SlID'];

print $dbG . " & " . $SlID;
?>

我遇到的问题是如何确定点击了哪些链接？目前，如果我有三个副本，然后单击一个，则三个副本都被激活。

我希望我已经说得够清楚了。我确信一定有一个简单的方法，但我对 Javascript/jQuery 很陌生。

4

4 回答 4

3

正如布赖恩所说，您可以在所有链接上放置相同的类，并$(this)在点击函数中使用 jQuery 中的关键字来找出点击了哪个链接。

这是使用此技术更改导航上的链接颜色的基本示例：http: //jsfiddle.net/9E7WW/

HTML：

<a class="nav">Test</a>
<a class="nav">Test2</a>
<a class="nav">Test3</a>
<a class="nav">Test4</a>

Javascript：

$(document).ready(function(){
    $('.nav').click(function(){
        // change all to black, then change the one I clicked to red
       $('.nav').css('color', 'black');
        $(this).css('color', 'red');
    });
});
于 2013-07-25T15:54:58.817 回答
2

我不确定我是否完全理解您遇到的困难，但以下是我将如何做到的。

<p class="ShowSDB_L2" class="center" data-dbg="<?php print dbG;?>" data-slid="<?php print $sLID;?>">Click Here to See Data</p>   
<div class="divSDB_L2"></div>

$(document).ready(function() {
    $(document).on('click', 'p.ShowSDB_L2', function(evt) {
        var $p = $(evt.currentTarget),
            dbG = $p.data('dbg'),
            slid = $p.data('slid'),
            $div = $p.next();

        FSD_L2(dbG, slid, $div);
    });
});

function FSD_L2(dbG, SlID, $div)
{
    $div.load("test15.php?dbG="+dbG+"&SlID="+SlID).css('display','block');
}

点击处理程序没有硬编码到每个p标签。相反，我们使用每个p标签存储所需的数据，即dbg& slid。

然后单击处理程序在 处附加一次document ready。jQuery 对各种浏览器进行抽象，并将event对象作为其第一个参数传递给它的处理程序。然后可以使用此对象查找发生事件的元素。参考：http ://api.jquery.com/on/

最后，我们从单击的元素中获取所需的数据，找到div需要更新的数据，然后调用您的自定义函数。

于 2013-07-25T16:00:21.393 回答
1

p使用数据属性将完整的 URL 添加到您的链接（或在本例中）：

<p class="ShowSDB_L2" class="center" data-loadurl="test15.php?dbG=<?php echo $dbG; ?>&SlID=<?php echo $SlID; ?>">Click Here to See Data</p> 

<div class="divSDB_L2"></div>

然后直接在你的 jQuery 中进行所有绑定，这样你就可以直接访问被点击的链接：

$(document).ready(function() {
    $('.ShowSDB_L2').on('click', function(e) {
        e.preventDefault();
        $('.divSDB_L2').empty().load($(this).data('loadurl')).show();
    });
});
于 2013-07-25T15:58:45.307 回答
1

这是一种跨浏览器查找触发事件（e）的元素（目标）的方法：

function getTarget(e){
// non-ie or ie?
e=e||window.event;
return (e.target||e.srcElement);
};
于 2013-07-25T15:56:08.530 回答