1

Web アプリケーションで Google Maps Javascript API を使用しています。ユーザーがマップ上にマーカー/オーバーレイを描画するたびに、現在開いているフォームを表示するカスタム ツールチップ。jQuery を使用してフォームの 1 つをインタラクティブにしたいと考えています。具体的には、フォームの上部にあるラジオ ボタンの選択に応じて、さまざまなフォーム フィールドを表示したいと考えています。ただし、私の jQuery .change() ハンドラーは起動していないようです。

ツールチップを追加するコードは次のようになります。

google.maps.event.addListener(drawingManager, 'circlecomplete', function(circle) {
  var radius = circle.getRadius();
  var center = circle.getCenter();
  var circleForm = "<%= escape_javascript(haml(:tooltip_form)) %>";
  var circleInfoWindow = new google.maps.InfoWindow({
    content: circleForm
  });
  circleInfoWindow.setPosition(circle.getCenter());
  circleInfoWindow.open(map);

問題のラジオ ボタンは tooltip_form.haml にあり、「group1」という名前が付けられています。同じ $(document).ready() ブロックの下部に、次のような jQuery コードがあります。

$("input[name='group1']").change(function() {
  alert("Changed"); // sample code
});

ただし、ツールチップが表示され、ラジオ ボタンの選択を変更すると、ハンドラーが起動しません。「group1」という名前のラジオ ボタンをページ自体に追加すると、ハンドラーが起動しますが、円が描画された後に表示されるツールチップにある場合、ハンドラーは起動しません。誰でもこの問題を解決できますか?

4

0 に答える 0