(html )想在月曆加類似button讓他按下去可以連結到新的頁面要怎麼做

dreamweaver

eunice123 2021-08-30 20:58:45 ‧ 1211 瀏覽

分享至

拜託各位大神了~~


<script>
var N=new Date();
Form=document.checkdate;

function initCalendar(){

  Form=document.checkdate;
  Form.averagecyc.value=28;
  Form.averagemenses.value=5;
  //Form.Year.value=N.getFullYear();
  //Form.Month.value=N.getMonth()+ 1;
  //Form.Day.value=N.getDate();
  getCalendar(1,1);
  document.all.Calendar1.outerHTML=calendarStr;
  getCalendar(2,1);
  document.all.Calendar2.outerHTML=calendarStr;
}
function resetInput(){Form.reset();}
function getMonthDate(year,month){
//alert(month);
  var monthDays=new Array(12);
  monthDays[0]=31;monthDays[1]=28;monthDays[2]=31;monthDays[3]=30;
  monthDays[4]=31;monthDays[5]=30;monthDays[6]=31;monthDays[7]=31;
  monthDays[8]=30;monthDays[9]=31;monthDays[10]=30;monthDays[11]=31;
  if(((year%4==0)&&(year%100!=0))||(year%400==0)){
    monthDays[1]=29;
  }
  return monthDays[month];
}

</script>

japhenchen iT邦超人 1 級 ‧ 2021-08-31 09:12:50 檢舉

看你寫這麼多，眼睛看了也不好受，以後維護呢？

我會建議你用jQuery來管理這類工作，至少不用在HTML裡刻這麼多......在月曆的日期上按，也只需要
$(document).on("click",".cdate",function(){ .......... ));
你再去解綁在日期格裡的資料(建議綁在data裡)來做進一步處理

窮嘶發發發 iT邦高手 1 級 ‧ 2021-08-31 10:12:46 檢舉

calendarStr=calendarStr+"<a class=\""+ color+"\" onMouseOver=\"showMsg(event,'"+ msgStr+"',"+calendarID+");\" onMouseOut=\"hideMsg()\">"+ i+"</a></td>";
} else {
calendarStr=calendarStr+"<span class=\""+ color+"\">"+ i+"</span></td>";
}

這一段改成
calendarStr=calendarStr+"<a href=\"../"+calendarID"+i+"\".html target=/"_blank/""+class=\""+ color+"\" onMouseOver=\"showMsg(event,'"+ msgStr+"',"+calendarID+");\" onMouseOut=\"hideMsg()\">"+ i+"</a></td>";
} else {
calendarStr=calendarStr+"<span class=\""+ color+"\">"+ i+"</span></td>";
}
然後你把要跳過去的頁面一個一個寫好就好了

eunice123 iT邦新手 5 級 ‧ 2021-08-31 22:45:48 檢舉

我有照著你的方式改～但月曆會跑不出來?

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

qaz11226633

iT邦新手 4 級 ‧ 2021-08-31 08:22:25

最佳解答

可以直接在所需要的td Tag 裡下onclick=''語法

......
calendarStr=calendarStr+"<td align='center' onclick='redirect()' class='bt' bgcolor="+ trBgcolor+"> ";
......
function redirect(){
	window.location.href = "https://www.google.com.tw/";
}

應該是要這樣的效果吧?

回應 15
分享
檢舉

看更多先前的回應...收起先前的回應...

eunice123 iT邦新手 5 級 ‧ 2021-08-31 22:43:50 檢舉

我有試著照著你的方式改，但沒反應跟原本的一樣

qaz11226633 iT邦新手 4 級 ‧ 2021-09-01 14:17:05 檢舉

function redirect() 這段沒加錯地方吧

qaz11226633 iT邦新手 4 級 ‧ 2021-09-01 14:29:59 檢舉

https://jsfiddle.net/RightHua/8bo67fra/9/#&togetherjs=Hk0UEznFsK

eunice123 iT邦新手 5 級 ‧ 2021-09-02 00:01:19 檢舉

有了有了真的太感謝你了！！！

qaz11226633 iT邦新手 4 級 ‧ 2021-09-02 08:17:44 檢舉

不會唷，還請麻煩選個最佳解答，結個案，謝謝

eunice123 iT邦新手 5 級 ‧ 2021-09-05 15:14:33 檢舉

想問你「要怎麼讓他按不同顏色會跑不同頁面呢」

qaz11226633 iT邦新手 4 級 ‧ 2021-09-06 08:23:05 檢舉

calendarStr=calendarStr+"<a class=\""+ color+"\" onMouseOver=\"showMsg(event,'"+ msgStr+"',"+calendarID+");\" onMouseOut=\"hideMsg()\">"+ i+"</a></td>";
搬進你判斷經期IF ELSE裡,分別套用不同的onclick() Function

eunice123 iT邦新手 5 級 ‧ 2021-09-06 19:20:44 檢舉

不好意思，請問你說的判斷經期是指哪裡，不同的onclick function是什麼意思

qaz11226633 iT邦新手 4 級 ‧ 2021-09-08 08:11:39 檢舉

if(someDate>=0&&someDate<=(myavgMenses-1)){
        color="purple";msgStr="為經期，注意保暖身體，多休息！也可以穿上月亮褲喔";
        calendarStr=calendarStr+"<img src=https://goodmoonmood.com/wp-content/uploads/2020/12/blodd.png>";
      }
      if(someDate>=myavgMenses&&someDate<=(myavgCyc-20)){
        color="green";msgStr="為不易受孕期(俗稱安全期)，性事較不易受孕，但如果沒有懷孕打算還是建議要做避孕措施！";
      }
      if(someDate>=(myavgCyc-19)&&someDate<=(myavgCyc-10)){
        color="red";msgStr="是不易受孕期(也稱危險期)，性事受孕可能性大，要注意避孕措施喔！";
      }
      if(someDate>=(myavgCyc-9)&&someDate<=(myavgCyc-1)){
        color="green";msgStr="為安全期，性事一般不會受孕，但如果沒有懷孕打算還是建議要做避孕措施！";
      }

這裡是你判斷經期的地方
至於不同的onclick()是不是不太了解HTML跟JS 語法?

eunice123 iT邦新手 5 級 ‧ 2021-09-09 22:27:42 檢舉

對~不太熟但有嘗試上網查資料

qaz11226633 iT邦新手 4 級 ‧ 2021-09-10 07:58:20 檢舉

onclick 參數是JS 的Function
你大約了解到甚麼程度?

eunice123 iT邦新手 5 級 ‧ 2021-09-11 18:11:30 檢舉

onclick用來觸發JavaScript的function，但不知道要怎麼寫套用不同的onclick() Function

qaz11226633 iT邦新手 4 級 ‧ 2021-09-13 17:05:34 檢舉

原本 onclick='redirect()'
在紅色 onclick='red_redirect()'
以此類推

eunice123 iT邦新手 5 級 ‧ 2021-09-13 21:20:02 檢舉

有了有了，不好意思一直問你問題，在網路上找資料真的找不到我想要的，真的很感謝你!!!!!

qaz11226633 iT邦新手 4 級 ‧ 2021-09-14 08:49:55 檢舉

不會啦有解決就好

登入發表回應

我要發表回答

立即登入回答

參賽組數

1064 組

團體組數

40 組

累計文章數

22203 篇

完賽人數

602 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙