フォームに入力してiframe URLに出力する

Question

ユーザーが希望の場所を入力し、下のiframeに表示されるように地図を検索しようとしているため、ユーザーがロンドンを探してURLがgoogle.com/地図&場所=ロンドン。これまで出力部分を動作させることはできません。

私は私があなただけのSRCに場所を渡すことができるように必要なだけのiFrame

<div class="search"> 
<div class="row">  
    <div class="large-6 medium-6 small-12 columns"> 
     <div class="postcode-wrapper"> 
      <form class="lookup-form">     
       <input type="text" class="postcode" placeholder="Location" > 
       <input type="submit" class="go-btn" value="Search"/> 
       <a href="#" class="fancybox go" style="position:absolute; left:-99999px" data-fancybox-type="iframe">Search</a> 
       <div class="form-error"></div> 
      </form> 
      <script> 
       jQuery('form').submit(function (evt) { 
        evt.preventDefault(); 
        var error = false; 
        var error_list = []; 

        var $postcode = jQuery('.postcode').val(); 

        if($postcode == ''){ 
         error = true; 
         error_list.push('Location is required'); 
        } 
        console.log(error); 
        if(error === true){ 
         jQuery('.form-error').show(); 
         jQuery('.search-results').hide(); 
         jQuery('.form-error').html(''); 
         for(i=0;i<error_list.length;i++){ 
          jQuery('.form-error').append(error_list[i]+'<br/>'); 
         } 
        }else if(error === false) { 
         jQuery('.form-error').hide(); 
         jQuery('.postcode-wrapper .go').click(function(){ 
          jQuery(".search-results").slideDown("slow"); 
         });       

         var location = encodeURIComponent(jQuery('.postcode-wrapper .postcode').val()); 
         console.log(location); 
         jQuery('.postcode-wrapper .go').click();       
        } 
        return false; 
       }); 
      </script> 
     </div>   
    </div> 
</div> 
</div> 
<div class="search-results"> 
    <div class="map">  
     <iframe src="http://google.com/maps&location=OUTPUTHERE" width="100%" height="400" frameborder="0"></iframe> 
    </div> 
</div> 

Answer 1

に場所を移動する方法を考え出すことはできませんので、近いよ感じますか？ $('#selector').attr('src', value);

使用はまた、あなたのvar宣言は、値を取得するには、間違った選択を使用していました。

}else if(error === false) { 
    jQuery('.form-error').hide(); 
    jQuery('.postcode-wrapper .go').click(function(){ 
      jQuery(".search-results").slideDown("slow"); 
    });       

    var location = encodeURIComponent(jQuery('.postcode').val()); // Fix your selector 
    console.log(location); 
    $('iframe').attr('src', 'https://google.com/maps&location=' + location); // Add this 
    jQuery('.postcode-wrapper .go').click();       
} 

そして最後の事は、私は、URLが間違っていると信じて、それは https://www.google.com/maps/place/locationvariableでなければなりません。