javascript的selected如何自行判別為當前年,月呢?

javascript

candice242 2013-01-06 21:07:24 ‧ 4649 瀏覽

分享至

<select name="select10">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
如何在表單開啟時,select10的selected為當前月份呢?

海綿寶寶 iT邦大神 1 級 ‧ 2013-01-11 07:54:25 檢舉

Google到一個用jQuery的做法
javascript只要四列
See it in Action

candice242 iT邦新手 5 級 ‧ 2013-01-11 11:46:49 檢舉

不好意思
<select name="year" id="year">
<option value="2010">2010</option>
<option value="2011">2010</option>
<option value="2012">2010</option>
<option value="2013">2010</option>
你這段是不是寫錯了.

海綿寶寶 iT邦大神 1 級 ‧ 2013-01-12 16:09:39 檢舉

1.是寫錯了
2.不是我寫的

登入發表討論

直播研討會

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

直播中

4 個回答

Albert

iT邦高手 1 級 ‧ 2013-01-06 22:03:01

最佳解答

支持你前進的力量....

resultado.append("new Array(\"inpcBpartnerLocationId\", ");
if (tdv != null && tdv.length > 0) {
resultado.append("new Array(");

if (strLocation.isEmpty()) {
// If no location is provided, the first one is selected
resultado.append("new Array(\"" + tdv[0].getField("id") + "\", \"" + FormatUtilities.replaceJS(Replace.replace(tdv[0].getField("name"), "\"", "\\\""))

"\", \"" + "true" + "\")");
if (tdv.length > 1) {
resultado.append(",\n");
}
for (int i = 1; i < tdv.length; i++) {
resultado.append("new Array(\"" + tdv[i].getField("id") + "\", \"" + FormatUtilities.replaceJS(Replace.replace(tdv[i].getField("name"), "\"", "\\\""))
"\", \"" + "false" + "\")");
if (i < tdv.length - 1) {
resultado.append(",\n");
}
}
} else {
// If a location is provided, it is selected
for (int i = 0; i < tdv.length; i++) {
resultado.append("new Array(\"" + tdv[i].getField("id") + "\", \"" + FormatUtilities.replaceJS(Replace.replace(tdv[i].getField("name"), "\"", "\\\""))
"\", \"" + (tdv[i].getField("id").equalsIgnoreCase(strLocation) ? "true" : "false")
"\")");
if (i < tdv.length - 1) {
resultado.append(",\n");
}
}
}
resultado.append("\n)");
} else {
resultado.append("null");
}
resultado.append("\n),");

回應 1
分享
檢舉

Albert iT邦高手 1 級 ‧ 2013-01-06 22:10:36 檢舉

candice242提到：
單開啟時,select10的selected為當前月份呢

月份 :
Calendar cal = Calendar.getInstance();
cal.setTime(date);
int month = cal.get(Calendar.MONTH);

==================================================================
When month equal to month (show)
(tdv[i].getField("id").equalsIgnoreCase(Integer.toString(month)) ? "true" : "false")

登入發表回應

wiseguy

iT邦超人 1 級 ‧ 2013-01-07 00:16:11

在你的 <select 上加一個 id 屬性，並在 </select> 之後加一個 <script> 改變它的 selectedIndex 即可。如下所示

&lt;pre class="c" name="code">&lt;select id="select10" name="select10">
&lt;option value="">&lt;/option>
&lt;option value="1">1&lt;/option>
&lt;option value="2">2&lt;/option>
&lt;option value="3">3&lt;/option>
&lt;option value="4">4&lt;/option>
&lt;option value="5">5&lt;/option>
&lt;option value="6">6&lt;/option>
&lt;option value="7">7&lt;/option>
&lt;option value="8">8&lt;/option>
&lt;option value="9">9&lt;/option>
&lt;option value="10">10&lt;/option>
&lt;option value="11">11&lt;/option>
&lt;option value="12">12&lt;/option>
&lt;/select>
&lt;script>
document.getElementById('select10').selectedIndex = (new Date()).getMonth() + 1;
&lt;/script>

回應 10
分享
檢舉

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

wiseguy iT邦超人 1 級 ‧ 2013-01-07 09:19:36 檢舉

這邊用 javascript 取的月份，是 user 端的時間。下面3樓用 php 取的是 server 端時間。如果 server 端與 user 端的時區有可能不同，要注意功能上是要取哪個時間。

candice242 iT邦新手 5 級 ‧ 2013-01-10 07:50:43 檢舉

若是年份呢?可以用以下寫法嗎
<script>
document.getElementById('select10').selectedIndex = (new Date()).getYear();
</script>
select部份就不再詳細描述.

wiseguy iT邦超人 1 級 ‧ 2013-01-10 08:33:23 檢舉

呵 ... 可不可以，你試下去不就立即知道了？儘管試啦！電腦不會爆炸啦~

candice242 iT邦新手 5 級 ‧ 2013-01-10 22:22:12 檢舉

我試了.但不行,覺的很奇怪,才再請教你的.

wiseguy iT邦超人 1 級 ‧ 2013-01-10 23:10:09 檢舉

你把年份的 id 也寫 select10 跟月份一樣嗎？月份才只有 1 到 12 而已，選不到 2013 年很正常吧？

candice242 iT邦新手 5 級 ‧ 2013-01-10 23:52:33 檢舉

我的程式碼是:
<select id="select9" name="select9">
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
</select>
<script>
document.getElementById('select9').selectedIndex = (new Date()).getYear() ;
</script>

wiseguy iT邦超人 1 級 ‧ 2013-01-11 08:15:31 檢舉

知道後面為什麼要減 2011 吧？

&lt;pre class="c" name="code">document.getElementById('select9').selectedIndex = (new Date()).getYear() - 2011;

candice242 iT邦新手 5 級 ‧ 2013-01-11 11:45:08 檢舉

我不知道為什麼要減,但試過了.不行耶....

candice242 iT邦新手 5 級 ‧ 2013-01-12 13:13:05 檢舉

寫出來了
<select id= "select9" name="select9">
<option value="0">2011</option>
<option value="1">2012</option>
<option value="2">2013</option>
<option value="3">2014</option>
<option value="4">2015</option>
<option value="5">2016</option>
<option value="6">2017</option>
<option value="7">2018</option>
<option value="8">2019</option>
<option value="9">2020</option>
<option value="10">2021</option>
</select>
<script>
document.getElementById('select9').selectedIndex = (new Date()).getYear() - 2011;
</script>

wiseguy iT邦超人 1 級 ‧ 2013-01-12 21:51:46 檢舉

一點 programmer 的 Fu 都沒有 ....

登入發表回應

老鷹(eagle)

iT邦高手 1 級 ‧ 2013-01-07 08:19:33

顯示當月俺用的方法

&lt;pre class="c" name="code">
&lt;select id="select10" name="select10">
&lt;option value="&lt;?php echo date("m");?>">&lt;?php echo date("m");?>&lt;/option>
&lt;option value="1">1&lt;/option>
&lt;option value="2">2&lt;/option>
&lt;option value="3">3&lt;/option>
&lt;option value="4">4&lt;/option>
&lt;option value="5">5&lt;/option>
&lt;option value="6">6&lt;/option>
&lt;option value="7">7&lt;/option>
&lt;option value="8">8&lt;/option>
&lt;option value="9">9&lt;/option>
&lt;option value="10">10&lt;/option>
&lt;option value="11">11&lt;/option>
&lt;option value="12">12&lt;/option>
&lt;/select>

回應 7
分享
檢舉

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

炎之虛空 iT邦高手 3 級 ‧ 2013-01-07 09:07:01 檢舉

大鵰兇的寫法太長
縮短一下好了= =+

&lt;pre class="c" name="code">
&lt;select id="select10" name="select10">
&lt;?php
$m = range(1,12);
$now_m = date("m");
foreach ($m as $key => $value)
{
    echo '&lt;option value="' . $value . '" ' . ($value == $now_m?'selected':null) . '>' . $value . '&lt;/option>'."\n";
}
?>
&lt;/select>

wiseguy iT邦超人 1 級 ‧ 2013-01-07 09:12:43 檢舉

既然都用 php 了，這樣會不會比較省事一點？

&lt;pre class="c" name="code">&lt;select id="select10" name="select10">  
&lt;?php
$m = date('m'); // $m 從當前時間取得或是從前一次儲存的值取得
for($i=1; $i&lt;=12; $i++)
   echo '&lt;option value="',$i,'"',($i==$m?' selected':''),'>',$i,'&lt;/option>';
?>
&lt;/select>

老鷹(eagle) iT邦高手 1 級 ‧ 2013-01-07 09:33:20 檢舉

俺個人寫法關係
很少讓echo吐出HTML
(因為俺用框架開發的,採取MVC架構)

炎之虛空 iT邦高手 3 級 ‧ 2013-01-07 10:14:38 檢舉

我只有用 template、DBAD這兩個而已XDD
框架這部分就沒用了

fillano iT邦超人 1 級 ‧ 2013-01-07 11:07:56 檢舉

那來個smarty好了：

&lt;pre class="c" name="code">
&lt;?php
...
$m = date('m');
$opts = array();
for($i=1; $i&lt;=12; $i++) {
  $opt = array();
  $opt['opt'] = $i;
  if($m==$i) {
    $opt['sel'] = true;
  } else {
    $opt['sel'] = false;
  }
  $opts[] = $opt;
}
$tpl = new Smarty;
$tpl->assign('opts',$opts);
...

template：

&lt;pre class="c" name="code">
...
&lt;select id='select10' name='select10'>
{foreach from=$opts item=$opt}
&lt;option value='{$opt.opt}' {if $opt.sel}selected{/if}>{$opt.opt}&lt;/option>
{/foreach}
&lt;/select>
...

老鷹(eagle) iT邦高手 1 級 ‧ 2013-01-07 14:44:33 檢舉

不知道PHP5.?版
直接使用會出現錯誤,要改成這樣

<?php
date_default_timezone_set('Asia/Taipei');
echo date("Y-m-d A h:i");
?>

老鷹(eagle) iT邦高手 1 級 ‧ 2013-01-07 14:45:05 檢舉

<?php
date_default_timezone_set('Asia/Taipei');
echo date("m");//改成這樣
?>

登入發表回應

ccutmis

iT邦高手 2 級 ‧ 2013-01-09 10:20:26

小弟獻醜了~用jQuery的方式:

&lt;pre class="c" name="code">
&lt;meta http-equiv="content-type" content="text/html; charset=utf-8" />
&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">&lt;/script>
&lt;script type="text/javascript">
$(document).ready(function() { 
	gentMonth(); //建立月份選單
	selMonth(); //依目前月份選取
});
function gentMonth(){
		for(var i=0,tmp='';i&lt;=12;i++) tmp+=(i>0)?'&lt;option value="'+i+'">'+i+'&lt;/option>':'&lt;option value="">&lt;/option>';
		$('select[name="monthDL"]').html(tmp);
}
function selMonth(){
	$('select[name="monthDL"]').val(new Date().getMonth()+ 1);
}
&lt;/script>


&lt;select name="monthDL">&lt;/select>