php - 关于如何在 Javascript 和 PHP 中动态分配 Id 的更好想法

Question

我的很多 PHP 代码都会创建一个动态 ID 选择器，因为在执行 PHP 代码之前我没有 ID attr 值，所以我发现自己走了一条捷径并将 jquery javascript code 作为正在创建的 ID 的名称。

所以我想知道是否还有其他方法可以做得更好。我当前的方法有效，但我知道这是不好的做法。

为了说明我在做什么:

for ($x=0;$x>=10; $x++){
echo "...
    <script>
    $(function() {
    $( \"#dialog{$x}\" ).dialog({
        autoOpen: false,
        show: \"blind\",
        hide: \"explode\"
    });
    $( \"#opener{$x}\" ).click(function() {
      $( \"#dialog{$x}\" ).dialog( \"open\" );
        return false;
    });
    </script>
    ...";


  echo "<a id=\"opener{$x}\"> View Notes</a>";
  echo "<div id=\"dialog{$x}\">some data also dynamically generated depending on value of $x</div>";
}

Answer 1

您应该使用类和数据属性编写 HTML 标记。

例如:

<a href="#" class="opener" data-id="1">View Notes</a>
<div class="notes" data-id="1">My notes here</div>

<a href="#" class="opener" data-id="2">View Notes</a>
<div class="notes" data-id="2">My other notes here</div>

然后编写 JavaScript 以使用类选择器获取一组选项。

$('.notes').dialog({
    autoOpen: false,
    show: "blind",
    hide: "explode"
});

$('.opener').click(function(e) {
    $('.notes[dataId==' + $(this).data('id')).dialog('open');
    e.preventDefault();
});