0

そこで、最近のほとんどの Web サイトで見られるような単純な選択フォームを作成しようとしています。他のオプションをクリックしても次のページに移動できません。

<div class="pages" style="text-align:center; padding-top:10px; ">Navigation:
    <select style="width:300px;">
        <option value="/files/articles/1.html" selected="selected">1.Introduction</option>
        <option value="/files/images/6.html">2. images</option>
        <option value="/files/video/7.html">3. Video</option>
        <option value="/files/news/8.html">4. News</option>
    </select>
</div>

http://jsfiddle.net/yJM5c/5/

4

4 に答える 4

0 
<script type="text/javascript">
    $(document).ready(function() {
        $(".pages select").change(function() {
            window.location = $(".pages select option:selected").val();
        });
    });
</script>
于 2013-09-21T07:57:44.220 に答える
0

onchange イベントをリッスンして、select タグの値が変更されたときにその値を取得し、次のようにその URL に移動します。

Javascript

function onChangeNavigate(d) {
  window.top.location = d.value;
}

HTML

<div class="pages" style="text-align:center; padding-top:10px; ">Navigation:
    <select onchange="onChangeNavigate(this)" style="width:300px;">
          <option value="/files/articles/1.html" selected="selected">1. Introduction</option>
           <option value="/files/images/6.html">2. images</option>
           <option value="/files/video/7.html">3. Video</option>
           <option value="/files/news/8.html">4. News</option>
    </select>
</div>

MDN オンチェンジ

于 2013-09-21T07:57:46.080 に答える
0 
   <div class="pages" style="text-align:center; padding-top:10px; ">Navigation:
                    <select style="width:300px;" onchange="nextpage(this)">
                        <option value="/files/articles/1.html" selected="selected">1. Introduction</option>
                        <option value="/files/images/6.html">2. images</option>
                        <option value="/files/video/7.html">3. Video</option>
                        <option value="/files/news/8.html">4. News</option>
                    </select>
                    </div>


    <script type="text/javascript">
    function nextpage(select){
        window.location = select.value;
    }
    </script>
于 2013-09-21T07:59:42.230 に答える
0

これを変更:<select style="width:300px;"> これに<select style="width:300px;" onchange="document.location = this.value">

于 2013-09-21T08:02:45.017 に答える