ZBLOG

$.ajax({ method: "POST", url: "../d/detail/keyInfo", data: { custId: custId }, success: function(result) { var jsonRes = JSON.parse(result); for (const item of jsonRes) { if (item.code === 'customerInfo...

要将按钮容器插入到特定的合同部分,而不是直接添加到 document.body 的底部,您需要首先找到目标元素的位置,然后在该位置插入您的 buttonContainer。假设您有一个用于显示合同信息的父元素,我们可以使用 JavaScript DOM 操作来实现。

下面是更新后的代码示例,说明如何找到包含合同信息的标签,并将按钮容器插入到该标签之后:

  1. // 找到包含合同信息的标签,例如通过其 class 或 id 选择器
  2. const contractLabel = document.querySelector('label.contract-info'); // 请根据实际情况修改选择器
  3. if (contractLabel) {
  4. // 创建按钮容器
  5. const buttonContainer = document.createElement('div');
  6. buttonContainer.innerHTML = `
  7. <div class="button-container">
  8. <button class="btn" data-action="action1">按钮1</button>
  9. <button class="btn" data-action="action2">按钮2</button>
  10. <button class="btn" data-action="action3">按钮3</button>
  11. <button class="btn" data-action="action4">按钮4</button>
  12. </div>
  13. `;
  14. // 将按钮容器插入到合同部分(label 后面)
  15. contractLabel.parentNode.insertBefore(buttonContainer, contractLabel.nextSibling);
  16. // 添加点击事件处理函数
  17. buttonContainer.querySelectorAll('.btn').forEach(button => {
  18. button.addEventListener('click', function() {
  19. const action = this.getAttribute('data-action');
  20. switch (action) {
  21. case 'action1':
  22. console.log('按钮1被点击');
  23. break;
  24. case 'action2':
  25. console.log('按钮2被点击');
  26. break;
  27. case 'action3':
  28. console.log('按钮3被点击');
  29. break;
  30. case 'action4':
  31. console.log('按钮4被点击');
  32. break;
  33. default:
  34. break;
  35. }
  36. });
  37. });
  38. }

关键点:

  1. 选择合适的元素:使用适当的选择器(例如 .class#id)来找到您想要在其后面插入内容的标签。

  2. 插入方法:利用 insertBefore() 方法,将新创建的 buttonContainer 插入到目标元素之后。这里用的是 contractLabel.nextSibling 来确保它放置在合适的位置。

注意事项:

  • 确保选取的元素存在,否则代码会出现错误。
  • 根据项目中实际 HTML 结构和 CSS 类名调整选择器,以确保能正确找到目标元素。


    内容由零声教学AI助手提供,问题来源于学员提问

本站部分文章来源于网络,版权归原作者所有,如有侵权请联系站长删除。
转载请注明出处:https://golang.0voice.com/?id=22059

分享:
扫描分享到社交APP
上一篇
下一篇
发表列表
游客 游客
此处应有掌声~
评论列表

还没有评论,快来说点什么吧~

联系我们

在线咨询: 点击这里给我发消息

微信号:3007537140

上班时间: 10:30-22:30

关注我们
x

注册

已经有帐号?