【问题标题】:javascript, how to implement an index page function to execute a seperate page of .js functionsjavascript,如何实现一个索引页面功能来执行一个单独的页面的.js函数
【发布时间】:2013-07-31 14:01:21
【问题描述】:

我创建了两个执行这些任务的函数:

function displayBanner(currentDate) {
    /* get the month from current Date */

    /* Set the imgsource variable to be the defaultLogo
            image */

    /* If month is 12, 1, or 2, set variable imgsource to
              winterLogo or to the defaultLogo if not one of those 
              three months */

    /* If month is 3, 4, or 5, set imgsource to springLogo 
              or to the defaultLogo if not one of those three
              months */

    /* If month is 6, 7, or 8, set imgsource to summerLogo 
              or to the defaultLogo if not one of those three
              months */

    /* If month is 10, 11, or 12, set imgsource to fallLogo 
              or to the defaultLogo if not one of those three
              months */

    /* Return the imagesource variable to set the myBanner 
              imgSrc attribute to that image*/
}

function calcDaysToSale(currentDate) {
    /* create a Date object for the 15th of the 
              current month */
    /* compute difference in days between currentDate
              And the 15th */
    /* if the difference is positive return that value
              Else return message that the sale is over for this 
              month */
}

但是!我的意思是创建第三个函数,它可以驻留在索引页的标题中,随后可以执行这些函数,这就是问题所在——我想不通。

我已经使用 'alert();' 检查了我的工作功能,这表明我创建的两个操作是合理的,但我无法确定如何让他们的行为可以这么说。

页面如下所示:

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


var curdate = new Date()
alert(curdate);

function displayBanner(currenttDate) {
    var munf = currenttDate.getMonth();

    switch (munf) {
    case 9:
    case 8:
    case 10:
        imageSrc = 'fallLogo.gif';
        break;
    case 11:
    case 0:
    case 1:
        imageSrc = 'winterLogo.gif';
        break;
    case 2:
    case 3:
    case 4:
        imageSrc = 'springLogo.gif';
        break;
    case 7:
    case 5:
    case 6:
        imageSrc = 'summerLogo.gif';
        break;
    default:
        imageSrc = 'defaultLogo.gif';
    }

    return imageSrc;
}


function calcDaysToSale(currentDate) {

    var saleMessage;
    var mday = currentDate.getDate()

    if (currentDate < 15) {
        var lef = (15 - currentDate);
        //alert("There are " + lef + " days until the Sale.");
        saleMessage = lef;
    } else if (currentDate == 15) {
        //alert("The Sale is today!");
        saleMessage = "Zero, it's Today!";
    } else {
        //alert("The Sale for this month has ended.");
        saleMessage = "The Sale for this month has ended.";
    }

    return saleMessage;
}

alert(calcDaysToSale(curdate));
alert(displayBanner(curdate));

function pageSetup() {
}



 </script>

</head>

<body  class="oneColLiqCtrHdr">

<div id="container">
<div id="header">
<p><img name="myBanner" id="myBanner" src="" 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>
</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>
</body>
</html>

但正如我所说,我的意思是删除前两个函数,将它们放入单独的“flowers.js”页面并使用 pagesetup() 函数运行所有内容。

这两个函数的目标是一方面为横幅设置图像源,另一方面在底部显示距离“促销”(即 15 日)的剩余天数月,或者如果 15 号已经过去,让用户知道该信息。

【问题讨论】:

  • ECMAScript/Javscript 与 Java 不同。
  • 你能用三行解释你想要达到的目标吗?保持简单..如果你这样做我会帮忙
  • 如果您确实将这些函数放在另一个 js 文件中,究竟会发生什么?你有错误吗?
  • 你的问题有点不明确,但我承认你似乎意识到了这一点;我至少了解该页面似乎没有按照您的希望执行。至少,您知道大多数现代浏览器为您提供的调试工具吗?您仍然需要在较旧的浏览器中进行测试,但是如果您打开 Google Chrome 并按 F12,然后单击“脚本”选项卡,您实际上可以设置断点来为自己提供比仅使用“alert()”更好的信息“在不同的地方。它还有一个控制台,可以报告“未定义”之类的错误。

标签: javascript forms function calendar


【解决方案1】:

虽然你的问题不是很清楚。让我试一试。因此,您将这两个函数移到了一个新的 js 文件“flowers.js”中。在这个页面上包含了flowers.js,现在尝试从这个页面上存在的 pageSetup 方法调用这两个函数。那是你试过的吗?它没有工作吗?

如果没有,那么您需要确保“flowers.js”已完成加载,然后才能调用它的函数。检查这是否导致问题的一种方法是更改​​代码以仅在页面完成加载后调用 pageSetup。

<body onload="pageSetup();">

如果您的问题完全不同,请告诉我。 :)

编辑:
要使用 javascript 在运行时设置图像源,您可以执行以下操作..

<img id="my_image_id" src="Flowers.JPG" alt="Random Flowers" width="200"   height="255" />

<script type="text/javascript">
    function changeImage(a) {
        document.getElementById("my_image_id").src=displayBanner(10);
    }
</script>

PS:
将 displayBanner 重命名为 get_image_source 什么的..

【讨论】:

  • 虽然你的问题不是很清楚。让我试一试。因此,您将这两个函数移到了一个新的 js 文件“flowers.js”中。在这个页面上包含了flowers.js,现在尝试从这个页面上存在的 pageSetup 方法调用这两个函数。那是你试过的吗?没用吗?
  • 虽然你的问题不是很清楚。让我试一试。因此,您将这两个函数移到了一个新的 js 文件“flowers.js”中。在这个页面上包含了flowers.js,现在尝试从这个页面上存在的 pageSetup 方法调用这两个函数。大家好^这是完全正确的。我有这两个功能,它们似乎可以工作,但我想将它们从我的索引页面的标题中取出并将它们传输到一个单独的 flowers.js 页面,然后通过第三个功能使用它们(将被容纳在原始索引页面中)调用pagesetup()。
  • 我不太确定如何做的另一件事是如何从该函数中准确设置图像源-> 是否有必要深入到代码中,直到图像在其中执行并且然后添加一个
猜你喜欢
  • 2017-09-17
  • 2012-10-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-05-10
  • 2022-01-22
  • 2018-04-12
  • 1970-01-01
相关资源
最近更新 更多