下拉列表項 - 優文庫

我有一個<select>字段，該字段在選擇列表項時顯示隱藏的div。下拉列表項

<select>中有樹項目，每個項目顯示隱藏的div。

我需要的是當我選擇了第三項並刷新頁面時，第三項應該不再被選中，但它應該改變爲第一項。

我試過selected="selected"代碼<option>但它沒有工作。

<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.4.js'></script> 

<script type='text/javascript'> 
//<![CDATA[ 
$(window).load(function(){ 
$("#column_select").change(function() {   
    $('div[id^=layout_select]').hide(); 
    $('.'+this.value).show(); 
}); 

}); 
//]]> 

</script> 
</head> 

<body> 
    <!-- this controls the selection of columns --> 
<select name="column_selec" id="column_select">  
    <option value="col1" selected="selected">1 column</option>  
    <option value="col2">2 column</option>  
    <option value="col3">3 column</option> 
</select> 


<!-- this controls the selection of columns --> 

<!-- if '1 column' is selected this div is shown --> 
<div id="layout_select1" class="col1">You only have one column!</div> 

<!-- if '2 column' is selected this div is shown --> 
<div id="layout_select2" class="col2" style="display:none">  
    <input type="radio" id="'.$option[0].'" name="'.$option[0].'" size="25" value="lay1" '.$layout1.' />imaage1 
    <input type="radio" id="'.$option[0].'" name="'.$option[0].'" size="25" value="lay2" '.$layout2.' />imaage2 </div> 
<!-- if '3 column' is selected this div is shown --> 
<div id="layout_select3" class="col3" style="display:none"> 
    <input type="radio" id="'.$option[0].'" name="'.$option[0].'" size="25" value="lay3" '.$layout3.' />imaage3 
    <input type="radio" id="'.$option[0].'" name="'.$option[0].'" size="25" value="lay4" '.$layout4.' />imaage4  
    <input type="radio" id="'.$option[0].'" name="'.$option[0].'" size="25" value="lay5" '.$layout5.' />imaage5 
</div>

來源

2011-12-23 Vika Hatwal

刷新頁面重新加載，設置回一切到原來的狀態。如果要在頁面刷新之間保留狀態，則需要將更改存儲在服務器上，並在加載時輸出新頁面，或通過Javascript localStorage（HTML5）在本地存儲更改。 – 2011-12-23 20:39:06

你可以把它變成一個表單並提交給當前頁面，然後檢查'$ _POST ['whatever']'來查看是否建議了選項3。如果是，請選擇選項1.如果不是，則不要執行任何操作。這是你可以使用的一種方法，就像Matt H所建議的那樣。如果你不需要PHP，[localStorage]（http://dev.w3.org/html5/webstorage/）就可以工作。 – Purag 2011-12-23 21:04:41

試試這個代碼，這將選擇在下拉第一個選項下來的時候頁面就會刷新

$(document).ready(function(){ 
    $('#column_select').val('col1'); 
});

來源

2011-12-23 21:16:09

回答

相關問題