Question

好的，当用户点击添加因为它与记录相关时，Add假设获取并且我们获得与记录相关的DIV ID。我非常接近它的工作，但我只需要动态传递选择器。

你会如何动态传递你的选择器？

<tr>
    <td>1/1/0001</td>
    <td>SOME FName</td>
    <td>SOME LNAME</td>
    <td>SKIN TW</td>
    <td>SOMEID</td>
    <td>1/7/2009</td><td>Graph Trend View <a href="#" id="dialog_3333333" class="ui-state-default ui-corner-all">Add</a></td>
    <td class="hide-cell">
    <!-- ui-dialog -->
   <div id="dialog_3333333_message" title="3333333 THOMAS LNAME">
    <p>3333333 THOMAS LNAME, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
   </div>            
    </td>
</tr>

    <tr>
        <td>6/21/2010</td>
        <td>EMERY</td>
        <td>LNAMED</td>
        <td>RAND E</td>
        <td>77777777777</td>
        <td>1/7/2009</td><td>Graph Trend View <a href="#" id="dialog_77777777777" class="ui-state-default ui-corner-all">Add</a></td>
        <td class="hide-cell">
        <!-- ui-dialog -->
       <div id="dialog_77777777777_message" title="77777777777 EMERY RANDOLPH">
        <p>77777777777 EMERY LNAME, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
       </div>            
        </td>
    </tr>

我非常接近解决方案，但无法通过这个障碍？

    $(function() {

      // Dialog
      **// This is where the dynamic selector needs to be passed in**
    $('#dialog_33333333_message').dialog({
        autoOpen: false,
        resizable: false,
        height: 260,
        modal: true,
        width: 240,
        buttons: {
          "Compare Carriers": function() {
            $(this).dialog("close");
          },
          "Save": function() {
            $(this).dialog("close");
          }
        }
      });

      // Dialog Link
      $('.ui-state-default').click(function() {

   var target = $(this).attr("id");   

      alert(target);

   $('#' + target + '_message').dialog('open');
        return false;
      });

      //hover states on the static widgets
      $('.ui-state-default').hover(
         function() { $(this).addClass('ui-state-hover'); },
         function() { $(this).removeClass('ui-state-hover'); }
        );
    });

这就是我的意思。 http://tinypic.com/r/2hs2o0i/7转到图片，我要发布新图片

Answer 1

你可以使用一个反映div对话框（ $（'div [id ^ =“dialog _”）。dialog（））的模式的选择器，并按如下方式使用它：

$(function () { 
    $('div[id^="dialog_").dialog({
        autoOpen: false,
        resizable: false,
        height: 260,
        modal: true,
        width: 240,
        buttons: {
            "Compare Carriers": function () {
                $(this).dialog("close");
            },
            "Save": function () {
                $(this).dialog("close");
            }
        }
    }); // Dialog Link      
    $('.ui-state-default').click(function () {
        var target = $(this).attr("id");
        alert(target);
        $('#' + target + '_message').dialog('open');
        return false;
    });
    //hover states on the static widgets    
    $('.ui-state-default').hover(function () {
        $(this).addClass('ui-state-hover');
    }, function () {
        $(this).removeClass('ui-state-hover');
    });
});

JQueryUI将动态选择器传递给Dialog

1 个答案: