変更アレイ内からurl値に移動します

オブジェクトの配列からすべてのオプションを取得している選択メニューがあります。下記参照。私はメニューを変更時に各状態のURL値に移動し、新しいタブで開くようにしたいが、私が持っているものは正しく発射していない。私は、url値を認識していないので、「false」を返し続けるif/elseステートメントを持っています。変更アレイ内からurl値に移動します

let states = [ 
     {id: 1, state: "Alabama", district: "1st District", url:"www.google.com"}, 
     {id: 2, state: "Alabama", district: "2nd District", url:"www.google.com"}, 
     {id: 3, state: "Alabama", district: "3rd District", url:"www.google.com"}, 
     {id: 4, state: "Alabama", district: "4th District", url:"www.google.com"}, 
     {id: 5, state: "Alabama", district: "5th District", url:"www.google.com"}, 
     {id: 6, state: "Alabama", district: "6th District", url:"www.google.com"}, 
     {id: 7, state: "Alabama", district: "7th District", url:"www.google.com"}, 
     {id: 9, state: "Alaska", district: "Statewide District", url:"www.google.com"}, 
     {id: 10, state: "Arizona", district: "1st District", url:"www.google.com"}, 
     {id: 11, state: "Arizona", district: "2nd District", url:"www.google.com"}, 
     {id: 12, state: "Arizona", district: "3rd District", url:"www.google.com"},

さらに多くの状態がありますが、それ以上はスニペットです。

<body> 
    <div class="container55"> 
     <h2>Find Out How Tax Reform Will Impact Your District</h2> 
     <select id="listed_states"> 
      <option>Find Your District Here</option> 
     </select> 
    </div> 
    </body> 


    <script> 
    $(document).ready(function() { 
    //Code block generating dropdown list from states object 
     for (let i = 0; i < states.length; i++) { 
     if (states[i].id > 0) { 
     var option = $("<option>", { 
     text: states[i].state + " " + states[i].district, 
     value: states[i].id 
     }); 
     $('#listed_states').append($(option)); 
    } 
    } 



    $('#listed_states').on('change', function(){ 
    if ($(this).url){ 
    window.open($(this).url, '_blank'); 
    } else { 
    console.log('false'); 
    } 
    }) 
}); 
</script>

出典

2017-11-15 OsuDani

あなたの 'states'配列から' url'をあなたの '

オプション行方不明URLとあなたが$（この）.find（ 'オプション：選択'）と$（この）する.urlを変更。ATTR（ 'URL'）

//Code block generating dropdown list from states object 
      for (let i = 0; i < states.length; i++) { 
      if (states[i].id > 0) { 
      var option = $("<option>", { 
      text: states[i].state + " " + states[i].district, 
      value: states[i].id, 
      url : states[i].url 
      }); 
      $('#listed_states').append($(option)); 
     } 
     } 



     $('#listed_states').on('change', function(){ 
     if ($(this).find('option:selected').attr('url')){ 
     window.open($(this).find('option:selected').attr('url'), '_blank'); 
     } else { 
     console.log('false'); 
     } 
     }) 
    });

https://codepen.io/piscu/pen/eeGzBP

出典

2017-11-15 20:24:07 piscu

これは終わりですが、URLパスはwww.google.comで働いている場所であればどこでもかまいません。コードペンのあなたは：https://codepen.io/boomerang/iFrameKey-d75ac767-3298-4621-99fc-23669e18dc49/www.google.comです。これを変更する方法はありますか？オブジェクトにあるようにURLを開くだけですか？ – OsuDani

@OsuDani URLはhttp：// http://www.google.comではなくwww.google.comである必要があります – piscu

私はそれを試していたときに私はそれを考え出しました。再度、感謝します！ :) – OsuDani

変更アレイ内からurl値に移動します

答えて

関連する問題