單選按鈕到javascript

我目前有一個使用單選按鈕選擇項目的表單。我想要做的是根據所選的單選按鈕添加特定天數到今天的當前日期。我不確定如何做到這一點，但我目前的想法是使用IF語句來比較哪個按鈕被選中，並且如果它是將數字添加到getDate（）值。我目前正在42/43線工作。這是到目前爲止我的代碼：單選按鈕到javascript

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>Digital Photos</title> 
 
</head> 
 
<body> 
 
<a href="../../index.htm" title="Index">Web Program Homepage</a><br> 
 
<a href="../home.htm" title="Index">ITWP Course Homepage</a> 
 
<p> 
 
<form> 
 
Select the type of item you want to order: 
 
<br> 
 
<input type="radio" name="order" onclick="check(this.value)" value="Hard-Copy Print">Hard-Copy Print<br> 
 
<input type="radio" name="order" onclick="check(this.value)" value="Poster">Poster<br> 
 
<input type="radio" name="order" onclick="check(this.value)" value="Coffee Mug">Coffee Mug<br> 
 
<input type="radio" name="order" onclick="check(this.value)" value="T-Shirt">T-Shirt<br> 
 
<br> 
 
You are ordering a: <input type="text" id="answer" size="20"> 
 
</form> 
 

 
<script type="text/javascript"> 
 
/* <![CDATA[ */ 
 
function check(order){ 
 
    document.getElementById("answer").value=order; 
 
} 
 
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; 
 
document.write("Todays date is " + today); 
 
if 
 
document.write(". Your order will be ready on " + today); 
 
/* ]]> */ 
 
</script> 
 
<p></p> 
 
<a href="http://validator.w3.org/check?uri=referer" title="HTML5 Validation">HTML5 Validation</a> 
 
</body> 
 
</html>

來源

2014-11-02 Zack

好了，這顯然是一個家庭作業，而我，至少，不會爲你寫的代碼。一旦你寫了一些代碼，我會很高興幫助解決問題，而不僅僅是一個「想法」。同時，請確保您使用Chrome的開發人員工具或Firefox的Firebug中的「控制檯」選項卡。 – 2014-11-02 18:28:20

@Zack，如果你希望人們幫助你，你應該回到以前在StackOverflow上提交的問題，並選擇/批准幫助你的答案。做一個好的SO公民！ – istos 2014-11-02 18:33:40

好吧，我可以看出這可能是一項任務 - 但我最適合通過示例學習。也就是說，你需要查看代碼並理解它（否則你將永遠不會擅長編程）。

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Digital Photos</title> 
</head> 
<body> 
    <a href="../../index.htm" title="Index">Web Program Homepage</a><br> 
    <a href="../home.htm" title="Index">ITWP Course Homepage</a> 

    <form> 
     Select the type of item you want to order: 
     <br> 
     <div onchange="check()"> 
      <input type="radio" name="order" value="Hard-Copy Print">Hard-Copy Print<br> 
      <input type="radio" name="order" value="Poster">Poster<br> 
      <input type="radio" name="order" value="Coffee Mug">Coffee Mug<br> 
      <input type="radio" name="order" value="T-Shirt">T-Shirt<br> 
      <br> 
     </div> 
    </form> 

    <div id="orderDetails"></div> 

<script type="text/javascript"> 

    /* <![CDATA[ */ 
    function check() { 

     var nodeList = document.getElementsByName("order"); 
     var value; 

     for (var i = 0; i < nodeList.length; i++) 
     { 
      if(nodeList[i].checked) 
      { 
       value = nodeList[i].value; 
       break; 
      } 
     } 

     var today = new Date(); 
     var arrival = new Date(); 

     if (value == "Hard-Copy Print") 
     { 
      //If this one is selected, shipment arrive at current time + 1 day 
      arrival.setDate(today.getDate() + 1) 
     } 
     else if (value == "Poster") 
     { 
      //If this one is selected, shipment arrive at current time + 2 days 
      arrival.setDate(today.getDate() + 2) 
     } 
     else if (value == "Coffee Mug") 
     { 
      //If this one is selected, shipment arrive at current time + 3 days 
      arrival.setDate(today.getDate() + 3) 
     } 
     else if (value == "T-Shirt") 
     { 
      //If this one is selected, shipment arrive at current time + 4 days 
      arrival.setDate(today.getDate() + 4) 
     } 
     else 
     { 
      alert("Something went really really reeeeeeeeealy wrong :)"); 
     } 


     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 
     } 

     var dd2 = arrival.getDate(); 
     var mm2 = arrival.getMonth() + 1; //January is 0! 
     var yyyy2 = arrival.getFullYear(); 

     if (dd2 < 10) { 
      dd2 = '0' + dd2 
     } 

     if (mm2 < 10) { 
      mm2 = '0' + mm2 
     } 

     today = mm + '/' + dd + '/' + yyyy; 
     arrival = mm2 + '/' + dd2 + '/' + yyyy2; 

     var details = "You are ordering: " + value + "<br/><br/> Todays date is " + today + "<br/><br/>" + "Your order will be ready on " + arrival; 

     document.getElementById("orderDetails").innerHTML = details; 
    } 

</script> 
<p></p> 
<a href="http://validator.w3.org/check?uri=referer" title="HTML5 Validation">HTML5 Validation</a>

來源

2014-11-02 19:28:37

謝謝，這對我來說是一個很好的例子。 – Zack 2014-11-02 19:42:13

好，只要確保你瞭解代碼:) – 2014-11-02 19:44:24

我很好奇有沒有辦法使輸出不加載在新頁面上，而是在同一頁面上的文本框中動態更新，取決於選擇哪個按鈕？ – Zack 2014-11-02 19:46:57

我的做法是有收音機值，可以在陣列中使用的密鑰字符串：

<input type="radio" name="order" onclick="check(this.value)" value="hard_copy_print">Hard-Copy Print<br> 
<input type="radio" name="order" onclick="check(this.value)" value="poster">Poster<br> 
<input type="radio" name="order" onclick="check(this.value)" value="coffee_mug">Coffee Mug<br> 
<input type="radio" name="order" onclick="check(this.value)" value="t_shirt">T-Shirt<br>

然後有存儲每個項目的訂單時間的鍵控陣列：

var orderTimes = array('hard_copy_print' => 4, 'poster' => 2, 'coffee_mug' => 6, 't_shirt' => 8);

然後使用無線電項目的值獲取訂單時間。

來源

2014-11-02 18:39:11

單選按鈕到javascript

回答

相關問題