2014-02-07 40 views
0

這是我的第一個問題發佈到堆棧溢出,所以請原諒我,如果我接近這個不正確。動態日期依賴對話框

我試圖完成的事情:創建一個動態彈出窗口,根據設定的日期範圍顯示兩條消息之一。

此消息的參數的一個例子是:

從奇數年的9月1日到偶數年4月30日的費用爲$ 149

的費用從5月1日的甚至一年奇數年8月31日爲$ 249

依賴於這些日期範圍,我想彈出,只顯示當前費用

目前,我創建了一個靜態彈出窗口,但我不確定如何將此因素重新分配給對話框以動態顯示上述內容。我意識到這是一個非常簡單的腳本在其目前的狀態,但任何幫助將不勝感激。我搜索的幫助,但一直未能就這一特定類型的彈出

<!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>TEST</title> 
<script> 
function MyFunction() 
{ 
alert("The fee from September 1st of an odd year to April 30th of an even year is $149 \nThe fee from May 1st of an even year to August 31st of an odd year is $249"); 
} 
</script> 
</head> 

<a id="myLink" title="Click to display fee" href="Service_Pack_93_Planned_VR.pdf" onclick="MyFunction()">Application Form</a> 

<body> 
</body> 
</html> 

編輯 發現什麼更深的挖掘中的JavaScript條件語句和日期函數後,我想出了代碼如下。這是之前我看到aholmes的迴應(這是非常有用的)。我計劃重構我目前的內容,以便我的代碼更加有效,並且適應我從您的回覆中學到的內容。

<!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>Untitled Document</title> 
<script> 
function myFunction() 
{ 
var x=""; 
var startDate1=new Date('09/01/2013'); 
var endDate1=new Date('04/30/2014'); 
var startDate2=new Date('05/01/2014'); 
var endDate2=new Date('08/31/2015'); 

var today = new Date(); 
var dd = today.getDate(); 
var mm = today.getMonth()+1; //January is 0! 
var yyyy = today.getFullYear(); 
if(dd<10){dd='0'+dd} if(mm<10){mm='0'+mm} today = mm+'/'+dd+'/'+yyyy; 

if (startDate1 < today < endDate1) 
    { 
    x="The fee is $" + "149" 
    } 
else if (startDate2 < today < endDate2) 
    { 
    x="The fee is $" + "249" 
    } 
document.getElementById("test").innerHTML=x;  
} 

</script> 

</head> 
<body> 

<button onclick="myFunction()">Try it</button> 
<p id="test"></p> 

</body> 
</html> 

編輯

我一直在試圖讓我的代碼,因爲使用該信息來更新我的變量工作aholmes給我提供了,但都沒有成功。今天,我開始工作並修改了一些變量,我相信這是可行的。再次感謝您的幫助。如果有任何可以清理或修改的東西,請告訴我

<!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>Untitled Document</title> 
</head> 
<script> 
function myFunction() 
{ 
var x=""; 

// get the current date 
var date = new Date(); // Fri Feb 07 2014 11:34:32 GMT-0800 (PST) 

// this will return an integer, counting months starting from 0 (January). Since it is February at the moment, this will return 1. 
var month = date.getMonth(); // 1 

// this returns the full year as an integer - so 2014. 
var year = date.getFullYear(); // 2014 

var yearIsOdd = (year % 2 === 1); // false 

// remember, months are 0-based, so September (the 9th month) is represented by an 8. 
if (month >= 8 && yearIsOdd) {} // false - only month is checked due to short-circuiting. 

console.log("month:" + month + " Year:" + year + " Odd?" + yearIsOdd) 

// Remember order of operations. Division (and thus, modulo) happens before addition without parentheses! 
var nextYearIsEven = !((year + 1) % 2); // false 

if ((month >= 8 && yearIsOdd) || (month <= 3 && !yearIsOdd)) 
    {x="The fee is $" + "149"} // false - again, only month is checked 
else 
    {x="The fee is $" + "249"} 

document.getElementById("test").innerHTML=x; 
} 

</script> 

<body> 

<button onclick="myFunction()">Try it</button> 
<p id="test"></p> 

</body> 
</html> 

提前致謝!

回答

0

你需要查找的兩件事:Javascript中的條件語句和Javascript中的Date對象。

您需要在彈出式函數中使用條件語句來顯示一條消息或另一條消息。

if (condition) { 
    alert("The fee from September 1 of an odd year to April 30 of an even year is $149."); 
} else if (other condition) { 
    alert("The fee from May 1 of an even year to August 31 of an odd year is $249."); 
} 

我不知道你的病情應該是什麼,但我想你想比較今天的日期與這些範圍。 JavaScript有一個Date對象,您可以使用它來獲取特定的日期。

然後,所有你需要做的是:

var currentDate = new Date(); // today's date 
var oddStartDate = new Date(something here); // one date to compare 
var oddEndDate = new Date(something here); // other date to compare 
if (currentDate > oddDate && currentDate < oddEndDate) { 
    alert("Display one thing"); 
} else if (other condition) { 
    alert("Display other thing"); 
} 

注意上面的邏輯可能是不正確的,但它表明你需要在你的JavaScript函數來完成,以便爲它做你想要的是什麼。也可能有更好的方法來做到這一點!

1

您可以通過檢查當前的月份和年份來解決此問題,並使用模運算符來確定當前或下一年是偶數還是偶數。

JavaScript有一個名爲Date的對象,可以幫助您找到正確的方向。我們將使用的兩個方法是getFullYear()和getMonth()。

以下是您的原始參數。

從奇數年的9月1日到偶數年4月30日的費用爲$ 149

從偶數年的5月1日到奇數年8月31日的費用爲$ 249

因此,我們需要首先檢查當前月份是否「大於或等於9月」以及當前年份是否爲奇數。

以下是您可以如何在JavaScript中執行此操作的方法。

// get the current date 
var date = new Date(); // Fri Feb 07 2014 11:34:32 GMT-0800 (PST) 

// this will return an integer, counting months starting from 0 (January). Since it is February at the moment, this will return 1. 
var month = date.getMonth(); // 1 

// this returns the full year as an integer - so 2014. 
var year = date.getFullYear(); // 2014 

太棒了!現在我們有了解決這個問題所需的全部數據。現在我們如何確定你的第一個案例是否屬實?

第一部分是簡單的:

// remember, months are 0-based, so September (the 9th month) is represented by an 8. 
if (month >= 8) {} // false 

現在,我們如何判斷當前年份是否是奇數還是偶數?我將使用模運算符來查找年除以2的餘數。偶數中沒有餘數,而奇數的餘數爲1。

接下來,我要將它投射到布爾。這不一定是必需的,但明確使用bools會讓我感覺更好。我將結合使用兩個「非」操作符:!!

該第一數量(01)轉換成布爾(falsetrue)。第二個!然後否定結果,並翻轉falsetruetruefalse

讓我們看看它的行動。

var yearIsOdd = !!(year % 2); // false 

if (month >= 8 && yearIsOdd) {} // false - only month is checked due to short-circuiting. 

很酷!現在我們知道這一年是否奇怪,以及如果這個月是九月以後。

最後,我們需要確定月份是否在4月之前,以及年份是否是偶數。我正在閱讀你的問題,就好像你需要檢查一個範圍。那麼,我對當前日期的解釋是「是2014年9月到2015年4月之間的當月?」

我們打算做同樣的事情,我們設置yearIsOdd,只有我們必須添加1到當前年份。

另請注意,這次我不使用兩個!不是操作符。這是因爲我想要一個0(意思是偶數)將變量設置爲true,以及1(意思是不是)將變量設置爲false

// Remember order of operations. Division (and thus, modulo) happens before addition without parentheses! 
var nextYearIsEven = !((year + 1) % 2) // false 

if (month >= 8 && yearIsOdd && month <= 3 && nextYearIsEven) {} // false - again, only month is checked 

你走了!我把它留給你作爲解決你問題的第二個約束的練習。

至於對話框的內容,請看這個回答:jQuery dialog with dynamic content