首頁猿問如何使用PHP回顯做JS函數？

如何使用PHP回顯做JS函數？

PHP

慕碼人8056858 2023-10-22 20:51:22

我正在嘗試為從數據庫回顯的值數組創建一個彈出菜單。單擊svg時，需要顯示與echo中的svg對應的彈出菜單。除了到目前為止，它僅適用于第一個被回顯的。如何修復它，以便它顯示與正確的 svg 對應的彈出窗口。這是我目前得到的：PHP/HTML ：echo(' <svg class="option-3" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M9 10.5C9.82843 10.5 10.5 9.82843 10.5 9C10.5 8.17157 9.82843 7.5 9 7.5C8.17157 7.5 7.5 8.17157 7.5 9C7.5 9.82843 8.17157 10.5 9 10.5Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M15 10.5C15.8284 10.5 16.5 9.82843 16.5 9C16.5 8.17157 15.8284 7.5 15 7.5C14.1716 7.5 13.5 8.17157 13.5 9C13.5 9.82843 14.1716 10.5 15 10.5Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M3 10.5C3.82843 10.5 4.5 9.82843 4.5 9C4.5 8.17157 3.82843 7.5 3 7.5C2.17157 7.5 1.5 8.17157 1.5 9C1.5 9.82843 2.17157 10.5 3 10.5Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> </svg> <div class="menu-option-popout"></div>');.JS：document.querySelector(".option-3").addEventListener("click", function(){ document.querySelector(".menu-option-popout").style.display = "block";});

查看完整描述

2 回答

蝴蝶不菲

TA貢獻1810條經驗獲得超4個贊

如果每個彈出窗口都緊跟在其相應標記之后（如示例中所示），則可以利用該屬性來獲取所單擊的標記后面的。<div><svg>.nextElementSibling<div><svg>

在 HTML 的末尾：

// Add an event listener to each .option-3 element:

document.querySelectorAll('.option-3').forEach(item => {

item.addEventListener('click', event => {

let popout = event.target.nextElementSibling; // This element's next element (a .menu-option-popout)

popout.style.display = 'block'; // Show the popout

})

</script>

反對回復 2023-10-22

慕村225694

TA貢獻1880條經驗獲得超4個贊

首先，PHP是首先執行的，因此除非使用AJAX功能，否則您將無法從JS操作調用php。但這不是您的用例。

也就是說，我們可以繼續：

echo('

</svg>

');

應該這樣寫，以提高生成的HTML文檔的可讀性：

echo '<svg class="option-3" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">

</svg>

<div class="menu-option-popout"></div>'.PHP_EOL;

而且它只是存儲在數據庫中的HTML，所以有很多東西需要看：

任何錯誤的轉義字符串都可能將混亂放在顯示的數據中

任何錯誤的字符編碼都會將混亂放在您顯示的數據中

也許只需在該類上調用 ECMAScript 的 equiv JQuery 方法即可工作并根據需要顯示您的項目。.toogle().option-3

反對回復 2023-10-22

2 回答
0 關注
147 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何使用PHP回顯做JS函數？

如何使用PHP回顯做JS函數？

2 回答

添加回答

如何使用PHP回顯做JS函數？

如何使用PHP回顯做JS函數？