0

好的,所以这可能有点复杂,所以请耐心等待。

我有一个 HTML 块,其中包含几个具有坐标的隐藏字段:

    <div id="content">
<div class="event">
    Blah blah blah
    <input id="e1coords" class="coords" name="e1coords" type="hidden" value="-27.482359,153.024725" />
</div>

<div class="event">
    blah blah blah
    <input id="e2coords" class="coords" name="e2coords" type="hidden" value="-27.471134,153.0182" />
</div>
<div class="event">
    blah blah blah
    <input id="e3coords" class="coords" name="e3coords" type="hidden" value="-27.471667,153.023704" />
</div>
    </div>

我有一些代码应该从每个隐藏的输入(坐标)中获取值并将其传输到 href url 的一部分。例如:

   //GET COORDS
            $(content).find('.coords').each(function() {
                var coords = $(this).val();

                //CREATE BUTTON, ADD VALUE FROM
                var input2 = '<div class="inputholder"><a class="viewmap" href="maptest.html?longlat='+ coords +' "><button>Find on Map</button></a></div>';
                //ATTACH BUTTON
                $(input2).insertAfter($('#showday1 .save_event'));
            });  

这在一定程度上可以正常工作。它为每个输入创建一个按钮(因此在上面的示例中创建了 3 个按钮),但每次显示 3 次。所以从上面的 HTML 我得到 9 个按钮,应该有 3 个。

任何人都可以建议一种在每个隐藏输入中仅显示一次按钮的方法吗?

4

3 回答 3

1

编辑:

您的代码也可以正常工作。看这里

您的页面中是否有以下 HTML 块?

<div id="showday1">
    <div class="save_event">save event</div>
</div>

注意:上面的代码引用了这一行$('#showday1 .save_event')

于 2012-08-07T07:11:56.453 回答
1

你可以试试这个:

$('#content .coords').each(function() {
     var coords = $(this).val();
     //CREATE BUTTON, ADD VALUE FROM
     var input2 = '<div class="inputholder"><a class="viewmap" href="maptest.html?longlat='+ coords +' "><button>Find on Map</button></a></div>';
     //ATTACH BUTTON
      $(input2).appendTo($(this).parent()); //This append the button on the div event, change with #showday1 ...
});
于 2012-08-07T07:15:22.193 回答
1

如果您希望将生成的按钮放置在每个隐藏的输入 HTML 字段之后(基于您的输入),我会喜欢:

$(document).ready(function() {
           $(content).find('.coords').each(function() { 
                var coords = $(this).val(); 
                var input2 = '<div class="inputholder"><a class="viewmap" href="maptest.html?longlat='+ coords +' "><button>Find on Map</button></a></div>'; 
                $(this).after(input2);
            });   
});

由于您已经检测到输入(使用 class coords),afterjQuery 函数应该在每个隐藏的输入之后附加所需的内容


另一方面,如果您只想将所有按钮放在divwith的末尾id=content

$(document).ready(function() {
           var input2="";
           $(content).find('.coords').each(function() { 
                var coords = $(this).val(); 
                input2 += '<div class="inputholder"><a class="viewmap" href="maptest.html?longlat='+ coords +' "><button>Find on Map</button></a></div>'; 
            }); 
            $(content).after(input2);
});

在这种方法中,我们聚合了所有生成的输入(对于每个隐藏的输入),最后我们将它们附加到包装器中div

于 2012-08-07T07:51:52.803 回答