Question

我在使我的功能发挥作用方面遇到了麻烦，而我的书似乎是纯粹的垃圾。我确信这个错误纯粹是语法，尽管它可能更多。

这是我写过的JavaScript。显然，横幅功能并不能提供完整的功能，但它

function displayBanner(currentDate) {
    var imgSrc = defaultLogo;
    if  (currentDate.getMonth() == 1)
        imgSrc = "winterLogo";
    return ("<img src='" + imgSrc + ".gif'>");
}


function calcDaysToSale(currentDate) {
    var saleDay = new Date();
    saleDay.setDate(15);    // sets the sale date to the 15th of the current month

    // Subtracts the days remaining until the sale.
    // If the number is negative, the sale is over.
    var Days = saleDay.getDate()-currentDate.getDate();
    if (Days < 0) {
        return "The sale has ended.";
    }
    else {
        return Days;
    }
}

现在，我认为其原因在于它没有被正确调用。这是我在html页面的头部嵌入的功能：

<script type="text/javascript" src="flowers.js"></script>
    <script type="text/javascript">
        function pageSetup() {
          var today = new Date(); // this creates a date object with today's date
          var banner = displayBanner(today); // *should* call the displayBanner     function

          var days = calcDaysToSale(today); // *should* call the function using today's date
          document.sale.saleMessage.value = days; // *should* set the value to days.

      // Obviously none of it works.

    }

 </script>

我在页面底部打了pageSetup()。我在下面发布了完整的HTML代码。

这可能是，而且我很确定它是纯粹的语法问题。但是，我想到Google并在我的书中查找的内容并没有让我得到任何答案。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Carol's Flowers</title>
<link href="flowers.css" rel="stylesheet" type="text/css" />
   <script type="text/javascript" src="flowers.js"></script>
    <script type="text/javascript">
        function pageSetup() {
          var today = new Date(); // this creates a date object with today's date
          var banner = displayBanner(today); // *should* call the displayBanner function

          var days = calcDaysToSale(today); // *should* call the function using today's date
          document.sale.saleMessage.value = days; // *should* set the value to days.

          // Obviously none of it works.

        }

     </script>

</head>

<body  class="oneColLiqCtrHdr">

<div id="container">
  <div id="header">
    <p><img name="myBanner" src="banner" id="myBanner" alt="Carol's Flowers" />
      <!-- end #header -->
    </p>
    <div id="links"><a href="#">Home</a> | <a href="#">General Arrangements</a> | <a href="#">Seasonal Designs</a> | <a href="#">Custom Orders</a> | <a href="#">Location</a></div>
  </div>
  <div id="mainContent">
    <table id="mainTable">
    <tr>
       <td width="201"><h1><img src="Flowers.JPG" alt="Random Flowers" width="200" height="255" /></h1></td>
       <td width="687">
    <p>Here at Carol's Flowers, we believe that there is a perfect floral arrangment for every occasion! Take a look around and see if there is anything you like. If we don't already have it, then we will create it for you!</p></td>
    </script>
    </tr>
    </table>
    <!-- end #mainContent --></div>
  <div id="footer">
    <p> <form name="sale" id="sale">
      Days Until Mid Month Madness Sale : 
      <input type="text" name="saleMessage" id="saleMessage" /></form></p>
    <!-- end #footer --></div>
<!-- end #container --></div>

<!-- I am trying to run the script here -->
<script type="text/javascript">
    pageSetup();
</script>

</body>
</html>

Answer 1

您的问题可能只是找不到img网址。检查firebug正在解析的URL。可能只是没有在服务器上找到正确的路径。

firebug中的网址是否显示返回图片？图像网址是否完全被请求？

此外 - 您正在某处使用<img>标记，对吧？（见nnnnn的评论）

您可能希望执行以下操作：

var banner = displayBanner(today);
document.getElementById('myPlaceholder').innerHTML = banner;

但是，既然你说可见图像已损坏，问题可能就是网址无法正确解析。

对于本地页面，您可以右键单击损坏的图像并检查其URL。

Answer 2

您的displayBanner功能看起来不错，但要确保以下内容：

它返回的html字符串实际上是正确添加到文档中的。如果您不确定，请发布您的代码。
定义了变量defaultLogo。
您最终用于图片的src的字符串是转到您想要的图片的有效网址。

您将变量横幅设置为包含从displayBanner函数返回的html src，但您实际上并未在您发布的代码中对其执行任何操作。尝试添加

document.write( displayBanner(today) );

到你想要快速修复图像的html文档，或者将它放在你的javascript中的某个地方，使用你希望图像出现在里面的元素的id。

document.getElementById("desired_element_id").innerHTML = displayBanner(today);

对于另一部分，您的功能再次看起来很好，只需确保您正确地将其应用于文档。尝试将此添加到您的pageSetup函数。

document.getElementById("saleMessage").value = days;

编辑：我刚刚测试了你的代码。确保您实际上包含'flowers.js'文件，方法是在其中放入一些警报并查看它们是否在您打开主文档时显示。此外，我仍然无法找到定义'defaultLogo'的任何地方，因此可能导致您的图像src问题。

Answer 3

/*Working on same problem, did several hours of work but still need help.*/



<script type="text/javascript" src="flowers.js">
</script>

<script type="text/javascript">

var calcDaysToSale = new Date(); 
var displayBanner= getBanner(); 
var days = calcDaysToSale(); 

document.getElementById("Banner").innerHTML = displayBanner(today);
document.getElementById("saleMessage").value = days;
</script>

</head>
<body >

<div id="Banner">
<script type="text/javascript">
document.write("<img id='Banner" src='Banner"+bannerNum+".gif' alt='' />")

</script>
</div>

<div id="container">
<div id="header">
<p><img name="myBanner" src="banner" id="myBanner" alt="Carol's Flowers" />
 <!-- end #header -->
</p>
<div id="links"><a href="#">
Home
</a> 
| <a href="#">General Arrangements
</a> 
<a href="#">Seasonal Designs
</a>| 
<a href="#">Custom Orders
</a>
|<a href="#">Location
</a>
</div>
</div>
<div id="mainContent">
<table id="mainTable">
<tr>
<td width="201">
<h1>
<img src="Flowers.JPG" alt="Random Flowers" width="200" height="255" />
</h1>
</td>
<td width="687">
<p>Here at Carol's Flowers, we believe that there is a perfect floral arrangement for every occasion! Take a look around and see if there is anything you like. If we don't already have it, then we will create it for you!
</p>
</td>

</tr>
</table>
<!-- end #mainContent -->
</div>
<div id="footer">
 <p>
 <form name="sale" id="sale">

直至月中疯狂销售日期：

</body>

Answer 4

/*Javascript potion*/




Function List:
displayBanner(currentDate)
Using the date, sets the banner image source
calcDaysToSale(currentDate)
Returns the days to sale message
*/

//display the current month from date
document.clockform.monthnow. value="99";
document.clockform.datenow. value="99";

function Banner(currentDate) 
{

var imgSrc = Banner1;
if  (currentDate.getMonth() == 2)
    imgSrc = "Banner5";

if  (currentDate.getMonth() ==7 )
    imgSrc = "Banner4";

 if  (currentDate.getMonth() == 3)
    imgSrc = "Banner3";

if  (currentDate.getMonth() == 10)
    imgSrc = "Banner2";

return ("<img  src='Banner"+bannerNum+".gif' >");
}

function calcDaysToSale(currentDate)
 {
var saleDay = new Date();
saleDay.setDate(15);   

var Days = saleDay.getDate()-currentDate.getDate();

if (Days < 0) 
{
return ("The sale has ended.");
}
else
 {
return Days;
}
}

使用JavaScript函数来操作HTML

4 个答案: