-1

これは本当の「初心者」の質問ですが、私は JavaScript に苦労しています。曜日ごとに背景画像を変えたい。日付機能が正しく実装されていると思います。配列に配置された 7 つの画像のそれぞれに完全な URL があります。本体のボタンを介して機能する機能があります。配列要素を間違って呼び出して、それらを changeImage 関数に渡していると思います。配列参照 (piclnk[wkdy]) を完全な URL に置き換えると、機能します。もちろん、毎日変えていきたいです。おそらく簡単な答えですが、まだ見つけていません。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">

<head>
<script type="text/javascript">

function changeImage(newImage)
{
 elem = document.getElementById("mainpage");
 elem.style.backgroundImage = newImage;
}
</script>

</head>
<body id="mainpage" style="background-color:aqua">
<script type="text/javascript">
var piclnk = new Array();
var now = new Date();
var wkdy = now.getDay();
piclnk[0]='http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-  3Mp7SqD/0/X3/Moms-Visit-Beach-Busch14-X3.jpg';
piclnk[1]='http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-NpbsQVZ/0/X3/Moms-Visit-Phillies02-X3.jpg';
piclnk[2]='http://johndoc1.smugmug.com/2011Pictures/Beach/Brian-rests-a-shore-house/i-KtdDb9z/0/X3/Brian-beach-Frescos-007-X3.jpg';
piclnk[3]='http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-6FBTfLn/0/X3/Moms-Visit-Ed-Frescos03-X3.jpg';
piclnk[4]='http://johndoc1.smugmug.com/2011Pictures/Events/John-Cecilia-Wedding-Day/i-2D44Xrj/0/X3/John-and-Cecilia-wedding-068-X3.jpg';
piclnk[5]='https://sphotos-a.xx.fbcdn.net/hphotos-snc6/248107_3426722028174_1990858472_n.jpg';
piclnk[6]='http://johndoc1.smugmug.com/2002-pictures/Birthdays/Eileens-40th-at-Hershey/mom-michael-pippi/226530953_ULboq-X3.jpg';
var lnk = document.createElement('link');
lnk.type='text/css';
lnk.href=piclnk[wkdy];
lnk.rel='stylesheet';
changeImage('url(piclnk[wkdy])');
</script>
<button onclick="changeImage('url(http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-DNLjwPs/0/XL/Moms%20Visit%20Porch%2002-XL.jpg)')">Mom Celeste Julia</button><br>
<button onclick="changeImage('url(http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-sd3Cp9b/0/XL/Moms%20Visit%20Ed%20Frescos06-XL.jpg)')">Woltemates</button><br>
<button onclick="changeImage('url(http://johndoc1.smugmug.com/2011Pictures/Events/John-Cecilia-Wedding-Day/i-2D44Xrj/0/X3/John-and-Cecilia-wedding-068-X3.jpg)')">Eileen / Hilda</button><br>
</body>
</html>
4

3 に答える 3

1

'url(piclnk[wkdy])'テキストをchangeImage()関数に渡します-次のように変更すると、機能が開始されます。

changeImage('url(' + piclnk[wkdy] + ')');

また、ご存知のとおり、アレイを構築するためのより良い方法は次のとおりです。

var piclnk = [
    'http://first/image.jpg',
    'http://second/image.jpg',
    'etc'
];
于 2012-11-06T20:13:36.097 に答える
1

change 関数内に URL 文字列を追加することを提案できますか? そのような：

function changeImage(newImage) {
    document.getElementById('mainpage').style.backgroundImage = 'url(' + newImage + ')';
}

これで、次のいずれかを使用できます。

changeImage(piclnk[wkdy]);

または：

<button onclick="changeImage('http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-DNLjwPs/0/XL/Moms%20Visit%20Porch%2002-XL.jpg')">Mom Celeste Julia</button><br>

毎回 URL 文字列を追加する必要はありません。

編集：

コードを整形すると、次のようになります。

function changeImage(newImage) {
    document.getElementById('mainpage').style.backgroundImage = 'url(' + newImage + ')';
}

var picUrls = [
    'http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-3Mp7SqD/0/X3/Moms-Visit-Beach-Busch14-X3.jpg',
    'http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-NpbsQVZ/0/X3/Moms-Visit-Phillies02-X3.jpg',
    'http://johndoc1.smugmug.com/2011Pictures/Beach/Brian-rests-a-shore-house/i-KtdDb9z/0/X3/Brian-beach-Frescos-007-X3.jpg',
    'http://johndoc1.smugmug.com/2012Pictures/Beach/Mom-and-Brian-Visit-Avalon/i-6FBTfLn/0/X3/Moms-Visit-Ed-Frescos03-X3.jpg',
    'http://johndoc1.smugmug.com/2011Pictures/Events/John-Cecilia-Wedding-Day/i-2D44Xrj/0/X3/John-and-Cecilia-wedding-068-X3.jpg',
    'https://sphotos-a.xx.fbcdn.net/hphotos-snc6/248107_3426722028174_1990858472_n.jpg',
    'http://johndoc1.smugmug.com/2002-pictures/Birthdays/Eileens-40th-at-Hershey/mom-michael-pippi/226530953_ULboq-X3.jpg'
], weekDay = (new Date()).getDay();

changeImage(picUrls[weekDay]);
于 2012-11-06T20:17:18.147 に答える
0

配列項目を文字列に挿入する必要があります（現在のように、これは単なるリテラル文字列であり、配列をまったく参照していません）：

changeImage('url(' + piclnk[wkdy] + ')');
于 2012-11-06T20:13:27.530 に答える