无法在InfoWindow中使用内联表单标签

Question

我为此疯狂。我尝试了在网络上找到的所有可能的解决方案（这似乎适用于所有人），但似乎没有任何解决方案可行，因为我希望它在Google Maps InfoWindow中。

InfoWindow内容是通过Ajax加载的，所以我不确定在哪里放Jquery位 - 虽然我已经尝试过（我认为！）每种可能的组合。

解决方案尝试： Making Awesome Form’s Inline Labels with jQuery，jQuery Inline Form Labels，Awesome Inline Form Labels和其他人......

唯一可行的是HTML5的placeholder，但我对此并不满意，因为它在IE10之下效果不佳。

以下是所需效果的快照：

我希望这可以在下面的InfoWindow中工作。请参阅“Nome opcional”一文？我希望它是一个内联模糊标签，如上图所示。

这是用于加载InfoWindow内容的代码：

function load_newinfowindow_content(lat, long, infowindow){
    $.ajax({
    url: site_root +'map/newmarker_infowindow/'+lat+'/'+long,
    success: function(data){
      infowindow.setContent(data);
    }
  });
}

infoWindow是基本的HTML表单。 CSS对于所有页面都是全局的，包括InfoWindow（它可以正常工作）。

<form name="newMark" id="newMark" method=post action="<?php echo base_url();?>map/new_marker">
<input type=hidden name=latitude value="<?php echo $lat;?>"><input type=hidden name=longitude value="<?php echo $long;?>">
Deseja criar uma nova marcação aqui?
<label for="name">Nome opcional</label>
<input class="text name" type="text" id="name" name="name" size="20"/>
<input type="submit" value="Sim">

我已经尝试将JQuery的ready代码放在InfoWindow HTML中，将“outside”放在调用页面上。两者都不起作用。 有关为什么在InfoWindow中不起作用的任何提示？

Answer 1

搞定了！ 通过尝试将Javascript代码放在不同的位置，并按照评论中的建议，甚至尝试使用InfoWindow的domready事件，我找到了唯一真正有用的地方。

在我的AJAX调用中加载内容，它变成了这样：

function load_newinfowindow_content(lat, long, infowindow){
    $.ajax({
    url: site_root +'map/newmarker_infowindow/'+lat+'/'+long,
    success: function(data){
      infowindow.setContent(data);
      processInLineLabels();
    }
  });
}

并且所有解决方案中都存在的$( document ).ready(function()我变成了一个函数，就像下面的函数一样（但它也适用于其他函数）。

function processInLineLabels() {
  $('input[title]').each(function() {
      if($(this).val() === '') {
         $(this).val($(this).attr('title')); 
      }

   $(this).focus(function() {
      if($(this).val() == $(this).attr('title')) {
         $(this).val('').addClass('focused');  
      }
    });
    $(this).blur(function() {
       if($(this).val() === '') {
           $(this).val($(this).attr('title')).removeClass('focused');  
       }
     });
 });
}