0

此代码应该从带有 id 'links' 的 ul 中间的单击锚标记中获取 id,然后将该 id 用于整个页面的其他目的,但是警报显示我不断收到“未定义”好像元素没有id。我仔细检查了我的源代码,它们确实有 id,所以我不确定问题出在哪里。

$(function() {      
    $('ul#links > li > a').click(function() {

        var planet = $(this).id;
        alert(planet);
        $('#planet').removeClass();
        $('#planet').addClass('planet');

        var bg = 'black url(../img/' + planet + '.jpg) fixed no-repeat center';
        alert(bg);
        $('body').css('background', bg);
    });             
});

这个 Jquery 函数也被用作处理这种情况的 Javascript 方式。我已经实现了一个 PHP 解决方案,其中涉及被重定向到一个快速脚本,该脚本设置一个 cookie 并将用户返回到上一页,然后使用 cookie 加载新的 CSS。在禁用 JS 的情况下,有没有办法可以将该方法用作 JS 方法的备份?

该页面 - http://schnell.dreamhosters.com/folio/

4

3 回答 3

2

你非常接近:

$(function() {      
  $('ul#links > li > a').click(function() {
    var planet = this.id;
    $('#planet').removeClass().addClass("plane");
    var bg = 'black url(../img/' + planet + '.jpg) fixed no-repeat center';
    $('body').css('background', bg);
    return false;
  });             
});

首先,this.id会给你ID。jQuery 替代方案是$(this).attr("id").

其次,您可以链接addClass()removeClass()保存两次查找元素。对于您的问题,这不是必需的,但这是一种很好的做法。

第三,除非您希望链接遍历某个地方,否则您需要阻止默认操作(通过调用evt.preventDefault()传递给回调的事件对象)或简单地以return false;(也可以evt.stopPropagation())结尾。

最后,您所做的非常适合禁用 Javascript,因为您可以转到执行相同操作的页面。我不会为设置 cookie 和重定向而烦恼。如果脚本名称 URI 是/view/planet.php这样:

<a id="saturn" href="/view/planet.php?planet=saturn">Saturn</a>

在同一个脚本中,您可以执行以下操作(我在这里假设 PHP;我没有看到任何提及您使用的内容):

$planets = array(...);
$planet = $_GET['planet'];
if (in_array($planet, $planets)) {
  echo <<<END
<style type="text/css">
body { background: black url(.../img/$planet.jpg) fixed no-repeat center; }
</style>
END;
}

在渲染页面时。

于 2010-01-28T22:24:46.767 回答
0

您正在从元素创建一个 jQuery 对象并尝试从中获取 id。如果您使用 attr 方法会这样,但您应该只从元素本身获取 id:

var planet = this.id;

至于备份方法,这听起来很合理。但是,我不会链接到不同的页面,而是使用确定显示内容的查询字符串链接到同一页面。

于 2010-01-28T22:22:30.303 回答
0

$(this).id问题出在哪里...使用$(this).attr('id')

于 2010-01-28T22:23:31.250 回答