-4

我有一个我正在制作的小型 jQuery 游戏的代码,默认情况下所有图片(字符)都是隐藏的。有一个问题是“你准备好玩了吗?” 和一个是或否按钮。当您单击是按钮时,它会隐藏按钮和文本。它还应该显示第一张图像,即#main。由于某种原因,它不起作用。这是带有以下图像的jQuery代码:

$(document).ready(function(){
$('#main,#batman,#car,#hobo,#knife,#gangfight,#ganggun,#gangknife,#blood').hide(-100);  
var main=$('#main');  
 batman=$('#batman');  
 car=$('#car');
 hobo=$('#hobo');
 cop=$('#cop');
 knife=$('#knife');
 gangfight=$('#gangfight');
 ganggun=$('#ganggun');
 gangknife=$('#gangknife');
 blood=$('#blood');
    document.write('<title>LOAUP</title>');
    document.write('<center><h1>The life of an unlucky person</h1></center>');
    document.write('<center id="start">Are you ready to play?</center>');
    document.write('<center><button id="yes">Yes</button><button id="no">No</button></center>');
    $('#yes').click(function(){
        $('#yes,#no').hide(function(){
            $('#start').hide();
            $('#main').show
        });
        });
    $('#no').click(function(){
        $('#yes,#no').hide();
        $('#start').hide();
        document.write('<center>Ok, come back another time then.</center>');
    });
});
//Images below this (HTML)
<img id='main' src='/jquery/sprites/spritePerson.png' />
    <img id='batman' src='/jquery/sprites/spriteBatman.png' />
    <img id='car' src='/jquery/sprites/spriteCar.png' />
    <img id='hobo' src='/jquery/sprites/spriteHobo.png' />
    <img id='cop' src='/jquery/sprites/spriteCop.png' />
    <img id='knife' src='/jquery/sprites/spriteKnife.png' />
    <img id='gangfight' src='/jquery/sprites/spriteGangFight.png' />
    <img id='ganggun' src='/jquery/sprites/spriteGangGun.png' />
    <img id='gangknife' src='/jquery/sprites/spriteGangKnife.png' />
    <img id='blood' src='/jquery/sprites/spriteBloodPuddle.png' />

编辑:

这是示例:http: //jsbin.com/ocowas/1

4

1 回答 1

0

在您的#main 点击功能更改

$('#main').show

$('#main').show();

您的变量列表应该用逗号分隔而不是冒号分隔。并且您可能还想重命名您的变量,以通过前缀 $ 符号使它们更明显和更容易阅读/记住。例如,当您将选择器存储为变量时,请使用

var $element = $('#element'),
    $element2 = $('#element2'),
    $element23 = $('#element23');

此外, hide() 函数不会像您使用的那样采用负数。只需使用 hide() 进行即时隐藏,或使用 hide(100) 进行快速隐藏,使用 hide(2000) 进行慢速.. 检查:http ://docs.jquery.com/Effects/hide

例如,要在不使用 document.write 的情况下将 html 附加到文档中,可以将 html 存储为变量,然后选择 body 标记或任何其他标记,然后将 html 附加/前置或替换到该位置。

$('body').append(yourHTMLvar);
$('body').prepend(yourHTMLvar);
$('body').html(yourHTMLvar);

'title' 标签应该只出现在 html 文档的 'head' 标签之间。改用标题标签,从“h1”到“h6”。据我所知,html 'center' 标签也已被弃用。尝试改用“span”、“p”甚至“div”。

于 2013-02-04T01:41:31.637 回答