0

OK、これは少し複雑かもしれませんので、我慢してください。

座標を持ついくつかの非表示フィールドを含む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>

各非表示の入力（座標）から値を取得し、それをhrefurlの一部に転送することになっているコードがいくつかあります。例えば：

   //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から、3つあるはずの9つのボタンが表示されます。

非表示の入力ごとにボタンを1回だけ表示する方法を提案できる人はいますか？

4

3 に答える 3

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 ブロックがありますか?

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

注：上記のコードはこの行を参照しています$('#showday1 .save_event')

于 2012-08-07T07:11:56.453 に答える
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 に答える