1

私の目標は、ユーザーがフラグリンクをクリックし、ユーザーが状況を説明するためのテキストを入力するためのダイアログボックスポップアップを表示することです。フラグリンクがフラグが立てられている投稿に接続されているダイアログボックスのみを表示するように設定する方法が正確にはわかりません。これが私がこれまでに持っているものです:

jQuery:

$(document).ready(function() {

    $(".flagDialog").dialog({ 
        autoOpen: false,
        resizable: false,
        width: 550      
             });

    $(".flag").click(function() {
        var target = $(this);
        $(".flagDialog").dialog( "open" );
        $(".flagDialog").dialog("widget").position({
           my: 'left top',
           at: 'left bottom',
           of: target
        });
    });
});

HTML:

while($row = mysql_fetch_assoc($result)) {
     extract($row);

     <div class='flag'>Flag</div>
     <div class="flagDialog" title="Flag">
        <form action="flag.php" class="flagForm" method="post">
             <textarea name="flag_input" class="flagInput" rows="6" cols="55"><?php echo $username; ?></textarea>
         </form> 
     </div>
   }

現在、フラグリンクのいずれかをクリックすると、whileループポップアップをスローしたすべてのダイアログが表示されます。これは理にかなっていますが、それらを互いに区別して処理する方法がわかりません。 jQuery側。

4

2 に答える 2

0

どういうわけか、フラグにそれ自体に関する情報をもう少し与える必要があります。flag-divが生成される行は、次のようになります。

 <div class="flag" alt="<?php echo $row->ID; ?>">Flag</div>

フラグに関する情報をdivのalt属性に保存するだけです

jQueryでは、次のようなalt属性を参照します。

$(".flag").click(function() {
    var alt = $(this).attr("alt"); //Do something with it.
于 2013-02-18T11:17:16.537 に答える
0

各「フラグ」とダイアログを個別に識別する必要があります(ID、クラス、またはその他の属性を介して)

また

コードのHTMLが例のようになっている場合は、next()セレクターを使用できます。

$(".flag").click(function() { 
    $(this).next('div.flagDialog').dialog( "open" );
    $(this).next('div.flagDialog').dialog("widget").position({
       my: 'left top',
       at: 'left bottom',
       of: $(this)
    });
});
于 2013-02-18T11:27:54.757 に答える