在javascript中调用PHP变量

我想在HTML/Javascript中从PHP调用一个变量（id），其中DB中的行id将从锚发送到另一个页面，以便在表中查看行的详细信息

var eventContent = $('<div class="event-info">' + '<h4 class="event-name">' + point.name + '</h4><hr>' +
        '<span><h5>Date: </h5>' +
        '<p class="event-date">' + point.edate + '</p></span>' +
        '<p class="event-description">'+ point.description +'</p>' + 
        '<input type="button" id="view-event"  class="btn btn-info btn-sm" onclick="showDetails();" value="View Event" />'+
        '<a href="details.php<?php echo $id; ?>" class="btn btn-danger btn-sm">Remove Event</a>' +
        '</div>');

---

现在，这种方式将ID发送到输入，但它将相同的ID发送到每个项目-当前数据库中有5行ID从6到10，但当页面加载时，它将第一个ID（6）发送到所有事件，而不是从数据库中为每个事件提供其自己的唯一ID。

您的代码可以这样执行：

var id = <?php echo $id; ?>;
var eventContent = $('<div class="event-info">' + '<h4 class="event-name">' + point.name + '</h4><hr>' +
        '<span><h5>Date: </h5>' +
        '<p class="event-date">' + point.edate + '</p></span>' +
        '<p class="event-description">'+ point.description +'</p>' + 
        '<input type="button" id="view-event"  class="btn btn-info btn-sm" onclick="showDetails();" value="View Event" />'+
        '<a href="details.php?id=' + id + '" class="btn btn-danger btn-sm">Remove Event</a>' +
        '</div>');

---

一如既往，我们非常欢迎进一步的改进和建议。

看起来您的服务器正在返回一些事件数据。让它也返回事件ID

---

例如，如果您的页面为各种事件返回JSON，请在JSON对象中包含ID。

PHP是服务器端代码，因此当服务器处理访问文件的请求时，代码将被编译并解析为HTML。JS是客户端代码，因此它在用户浏览器上沿着解析的HTML代码运行。客户端JS无法执行任何PHP命令。当PHP直接输出标记时，会出现一些令人讨厌的情况。特别是在遗留项目中。因为重构可能比修补要昂贵得多。。。想想看。无论如何，上面的片段对我来说也没什么意义，我试着想象其中的差距，并提供一些不可知论的想法。不管怎么说，这似乎是一种“小心轻放”的情况，我不想出现在这种情况下“出乎意料的是，你有一些非典型的设置，如果你想分享更多，也许有人可以提供更好的综合答案。无论如何，这似乎是一个错误的方法在这么多的层次上，你可能想考虑一点重构。我已经尝试了另一种方式使用JavaScript克隆（）——它在我所说的最初的问题中被更新，我引用：对于每一个，克隆容器并给它分配一个唯一的ID：

var eventList = $("#event-details").clone().show();

google.maps.event.addListener(event_markers[i], "click", function () {
        infowindow.setContent(eventList[0]);
        infowindow.open(map, event_markers[i]);
        map.setCenter(marker.getPosition());
        map.setZoom(10);
    });

var id = <?php echo $id; ?>;
var eventContent = $('<div class="event-info">' + '<h4 class="event-name">' + point.name + '</h4><hr>' +
        '<span><h5>Date: </h5>' +
        '<p class="event-date">' + point.edate + '</p></span>' +
        '<p class="event-description">'+ point.description +'</p>' + 
        '<input type="button" id="view-event"  class="btn btn-info btn-sm" onclick="showDetails();" value="View Event" />'+
        '<a href="details.php?id=' + id + '" class="btn btn-danger btn-sm">Remove Event</a>' +
        '</div>');

<div class="event-info">
  <h4 class="event-name"></h4>
  <hr>
  <span>
    <h5>Date: </h5>
    <p class="event-date"></p>
  </span>
  <p class="event-description"></p>
  <input type="button" id="view-event" class="btn btn-info btn-sm"
    onclick="showDetails();" value="View Event" />
  <a class="btn btn-danger btn-sm">Remove Event</a>
</div>

// below is the javascript example for your manipulations

var id = <?php echo $id; ?>;
$('h4.event-name').html(point.name);
$('p.event-date').html(point.edate);
$('p.event-description').html(point.description);
$('p.event-description').html(point.description);
$('div.event-info a.btn').attr('href', 'details.php?id='+id);

var id = point.id;
$('div#' + id + ' h4.event-name').html(point.name);
$('div#' + id + ' p.event-date').html(point.edate);
$('div#' + id + ' p.event-description').html(point.description);
$('div#' + id + ' p.event-description').html(point.description);
$('div#' + id + ' div.event-info a.btn').attr('href', 'details.php?id='+point.id);