javascript
  • jquery
  • html-select
  • 2011-12-23 76 views 0 likes 
    0

    我有一個<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> 
    
    +0

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

    +0

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

    回答

    0

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

    $(document).ready(function(){ 
        $('#column_select').val('col1'); 
    }); 
    
    相關問題