为什么我在视图模板文件中得到双输入文本按钮

Question

我有一个views模板文件，它使用的是“显示输出”，该文件已复制并粘贴到我的.tpl文件中。

我想添加一个输入按钮来通过js控制字段的可见性，并且可以正常工作。

问题是出现了两个输入按钮，一个在视图内容的最后，另一个在我放置html输入代码的位置。由于某种原因，它也在完整代码中被打印出来。

这是我的代码

.tpl文件中的输入代码

<input id="flash-card-flip-button" type="button" value="Click" onclick="switchVisible();"/>

---

CSS

#card-back-side { display: none; }

---

我的自定义js文件中的js

function switchVisible() {
        if (document.getElementById('card-front-side')) {

            if (document.getElementById('card-front-side').style.display == 'none') {
                document.getElementById('card-front-side').style.display = 'block';
                document.getElementById('card-back-side').style.display = 'none';
            }
            else {
                document.getElementById('card-front-side').style.display = 'none';
                document.getElementById('card-back-side').style.display = 'block';
            }
        }
}