0

私はjqueryダイアログポップアップを使用しています。1 つのページにポップアップを必要とする複数の div (動的に作成) があります。現在の問題は、.open をクリックすると、すべて (10) のポップアップが開いていることです。1 つだけをトリガーするにはどうすればよいですか?

私のhtmlは次のとおりです。

      <a class="open" href="#">
          <img src="/images/someImage1.jpg" />
      </a>

    <div class="dialog" title="Gives Dialog Title"><!-- This is display:none in css-->
    <p> Dialog text and stuff</p>
   </div>

   <a class="open" href="#">
          <img src="/images/someImage1.jpg" />
      </a>

    <div class="dialog" title="Gives Dialog Title"><!-- This is display:none in css-->
    <p> Dialog text and stuff</p>
   </div>

私のjqueryは次のとおりです。

   <script type="text/javascript"> // added .dialog:disaplay:none; to desktop.css


  $(document).ready(function () {

      $('a.open').prop('id', function (i) {
          return '' + (i + 1);
      });

      $(".dialog").dialog({
              autoOpen: false,
              draggable: false,
              width: "300px",
              modal: true,
              buttons: {
                  "Close": function () {
                      $(this).dialog('destroy').remove()
                  }
              }

          });

      $("#1,#2,#3,#4,#5,#6,#7,#8,#9,#10")

   .click(function () {
  alert($(this).attr("id"));

  $(".dialog").dialog("open");
  return false;
   });
  });

    </script>
4

3 に答える 3

2

これは機能するはずです(またはその変形)。

$("#1,#2,#3,#4,#5,#6,#7,#8,#9,#10").click(function () {
  alert($(this).attr("id"));

  $(this).next(".dialog").dialog("open");
  return false;
});
于 2013-10-08T19:49:41.200 に答える