0

私はこのスクリプトを持っています。これは、ユーザーのメニューの可能性を与えてくれます。

特定の選択が行われた後、ユーザーが特定のページにリダイレクトされるようにする方法は?

<form action="...">
    <select name="name">
        <option>Option 1</option>
        <option>Option 2</option>
    </select>
</form>

オプション 1 = option1.php
オプション 2 = option2.php

4

2 に答える 2

1

オプション自体の選択時、またはフォームの送信時にリダイレクトしますか。前者の場合はjquery（クライアント側）で必要であり、後者の場合はフォーム送信時にサーバー側で行うことができます。

クライアント側の場合:

jQuery("#select_id").on('change', function(){
   var urlPath = jQuery(this).val().data('url');
   window.location.href = "http://www.projecturl.com/"+urlPath;
});

選択IDが次のように見える場合、

<select id="select_id">
   <option data-url="option1.php">Option 1</option>
   <option data-url="option2.php">Option 2</option>
</select>

サーバー側の場合:

受け取ったパラメーターに応じて、フォーム送信アクションにリダイレクト ロジックを記述する必要があります。

于 2013-06-02T14:40:45.373 に答える
1

onchange次のイベントを使用できますselect。

ステップ1：

<script>
  function redirectChange() {
      var newUrl = this.options[this.selectedIndex].value;
      document.location.href = "http://www.yourbaseurl.com/" + newUrl;
  }

</script>

ステップ 2 - オプション 1: 関数が次を使用してイベントをフックした後(チェーンを使用できるため、私はこの方法を好みます - に htmlをaddEventListener追加する必要があることに注意してください)idselect

<script>
document.getElementById("<insert your select id").addEventListener("change",redirectChange,false);  
</script>

ステップ 2 - オプション 2: または、直接onchangeイベント フックを使用して html を変更します (前の方が好みです)。

<form action="...">
    <select name="name" onchange="redirectChange(this)>
        <option value="option1.php">Option 1</option>
        <option value="option2.php">Option 2</option>
    </select>
</form>

ワーキングjsFiddle：

http://jsfiddle.net/mapVz/1/

于 2013-06-02T14:31:28.333 に答える