首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在Google标记中将jQuery对话框附加到InfoBubble

在Google标记中将jQuery对话框附加到InfoBubble
EN

Stack Overflow用户
提问于 2013-01-16 15:04:32
回答 1查看 632关注 0票数 1

我正在用谷歌地图编码v3。我想添加jQuery并将事件处理程序附加到infoBubble (一个可定制的infoWindow jscript扩展,我得到了这里)。

具体来说,我希望让用户点击infoBubble中的一个链接,并使用jQuery弹出一个对话框表单。对话框表单将提示用户输入,然后将其存储在MySQL中。

我已经坚持了一个月了。这是我最接近的一件事

将事件处理程序附加到google映射信息泡中的元素

下面是用于创建地图标记的javascript函数:

(Note:的想法是,如果将事件处理程序附加到infoBubble有效,我将用jQuery表单替换function() {alert("hi!");}。但不起作用。我尝试过使用"var str = 'onClick=formPopUp()';“,但是javascript不支持包含多个条目的提示对话框。而且,我也不知道如何在javascript函数(如formPopUp() )中调用jQuery。对不起,如果混淆了的话)

代码语言:javascript
复制
function createMarker(map, latlng, fields, name) {
      var str = "id='user-creates'";

      var html = "<b><font size='5'>" + fields["name"] + "</font></b>" + "</br>" + 
             "<font size='2'>" + fields["google_rating"] + " / 5.00" + "</font>" + "</br>" + 
                 "<font size='2'>" + fields["type"] + "</font>" + "</br>" + 
                 "<font size='2'>" + "Hours" + "</font>" + "</br>" + 
                 "</br>" + 
                 "</br>" +
                 "<font size='2'>" + "Top Reviews " + "(<i>" + fields["num_reviews"] + " Reviews</i>)" +  "</font>" + "</br>" + 
                 "<div " + str + ">" +  "Example</div>" + 
                 "</br>" + 
                 "</br>" + 
                 "<font size='2'>" + "Photos " + "(<i>0 Photos</i>)" + "</font>" + "</br>" +
                 "</br>" + 
                 "</br>" +
                 "<font size='2'>" + "Friends Who've Been Here " + "(<i>0 Friends</i>)" + "</font>" + "</br>" +
                 "</br>" + 
                 "</br>" +
                 "<font size='2'>" + fields["address"] + "</font>" + "</br>" + 
                 "<font size='2'>" + fields["phone_num"] + "</font>" + "</br>" + 
                 "<font size='2'><a href=" + fields["web_url"] + "Website" + "</a></font>";


      var marker = new google.maps.Marker({
            map: map,
            position: latlng
      });

      infoBubble = new InfoBubble({
            map: map,
            position: latlng,
            borderColor: '#D14836',
            borderWidth: 4,     
      });

      google.maps.event.addListener(marker, 'click', function() {
        infoBubble.setContent(html);

        google.maps.event.addListenerOnce(infoBubble, 'domready', function(){
             //jQuery code here
             google.maps.event.addDomListener($(infoBubble.getContent()).find('#user-creates')[0], 
                                'click', function() {alert("hi!")}); 

        });

        infoBubble.open(map, marker); 

        });

    }
EN

回答 1

Stack Overflow用户

发布于 2013-01-16 15:33:17

这串:

代码语言:javascript
复制
var str = 'id=user-creates';

不是嵌入在HTML中的正确格式。

它必须是:

代码语言:javascript
复制
var str = "id='user-creates'";
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/14361392

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档