-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 に答える