引导程序Popover中元素的document.querySelector

时间:2019-06-17 11:32:08

标签: javascript jquery twitter-bootstrap

我想在弹出框内选择元素,并在单击时创建ajax get调用。我不能首先选择元素。

<table class="table">
  <tbody>
  <tr>
    <td></td>
    <td>2016-06-06</td>
  </tr>
    <tr>
      <td>Worker 1</td>
      <td id="worker1_date1">8h</td>
    </tr>
  </tbody>
</table>
$("#worker1_date1").popover({
    html: true,
    content:" <span>Task 1: 6h. Approved: False <button id='btn_worker1_date1' class='btn btn-success btn-sm'>Approve</button></span> <span>Task 2: 2h. Approved: True <button id='btn_worker1_date2' class='btn btn-danger btn-sm'> Disapprove</button></span>",
});

// This works
document.querySelector("#worker1_date1").textContent = "Modified Text"

// This does not work
document.querySelector("#btn_worker1_date1").textContent = "Modified Text"

提琴https://jsfiddle.net/mzw87oqv/1/

1 个答案:

答案 0 :(得分:2)

仅当您单击弹出窗口所附加的元素时,弹出窗口才会将其HTML添加到DOM。因此,当您运行Traceback (most recent call last): File "import.py", line 1, in <module> import cv2 ImportError: No module named cv2 时,ID为document.querySelector("#btn_worker1_date1").textContent = "Modified Text"的元素在DOM上不存在,因此无法更改。

您可以通过侦听显示弹出窗口时触发的事件来解决此问题。

#btn_worker1_date1

请参见modified example