Question

我有一个奇怪的问题，我有一个隐藏和显示信息和更改颜色onclick的切换。它在我构建代码的页面上完美运行。例如，当切换开关时按钮背景改变颜色，当切换关闭时改变回来，因为我从数据库回显数据，我不得不在函数内调用我的脚本使其工作，但现在脚本不会改变颜色或按要求工作。我相信这是导致问题的功能，是否有替代功能。

我很新，似乎不知道为什么这不起作用，任何帮助都会受到赞赏。

   function toggle_visibility(id) {
            var button = document.querySelector('.button');
            button.addEventListener('click', function(event) {
                var target = document.querySelector(button.getAttribute('data-target'));
                if (target.style.display == "none") {
                    target.style.display = "block";
                    button.innerHTML = button.getAttribute('data-shown-text');
                    button.style.backgroundColor = "red";
                     button.style.border = "thick dashed #0000FF";
                } else {
                    target.style.display = "none";
                    button.innerHTML = button.getAttribute('data-hidden-text');
                    button.style.backgroundColor = "blue";
                   
                }
            
            });
               }

    echo("<div id='first_product'>");
        echo("<div class='button' data-target='#text' data-shown-text='Hide'   onclick='toggle_visibility(\"text\")  data-hidden-text='Mich'>" . $_SESSION['Food_Cat_name'] . " </div>");


        
            echo("<div id='text' class ='hidden'>");

Answer 1

这里缺少单引号：

onclick='toggle_visibility(\"text\")

在我添加之后为我工作：

onclick='toggle_visibility(\"text\")'

隐藏和显示切换/更改按钮颜色，不使用功能

1 个答案: