Javascript 仅在事件调用时加载iFrame

我有一个网页，上面有一个zipcode查找器。页面在这里

页面需要永远加载，因为；在后台，所有这些谷歌地图iFrame都在加载

我的问题是,；是否有方法仅在调用时加载iframe？那么，在输入邮政编码并单击go按钮之前，地图不会加载

代码：

   $(document).ready(function(){
      var zipCodes = [60538,60504];
      $("#buttontest").click(function(){
      var zipIndex = zipCodes.indexOf(parseInt($("#full_day").val()));
      $("#zipMessage > div").hide("fast");
      var zipId = zipIndex > -1 ? zipCodes[zipIndex] : "Error";
     $("#zip"+zipId).show("fast");
     });

     $("#full_day").keydown(function(e){
     if(e.which === 13){
        $("#buttontest").click();
         }
      });
   });

工作示例：

从iframe中删除src属性，并在搜索后分配它：

$('#iframe_id').attr('src', 'http://maps.google.com/?params=');

例如：

---

由于src属性，因此加载了iframe。如果你一开始不填写，但只在输入zipcode时填写，就可以了。你应该只使用一个iframe，在需要的时候设置src。我做得不对。你能在fiddle上使用这个例子并按照建议更新代码吗？？更新答案，检查示例。我有另一个关于这个特定主题和代码的问题。