xampp中出现奇怪的javascript

出于某种奇怪的原因，以下jfiddle在我的XAMPP中起作用：显然，top和bottom div不完整，不应该存在；但是，当我删除它们时，代码不起作用

HTML代码：

    <form action="" class="search-form">
            <div class="cell">
                <input type="text" name="q" onClick="action();"/>
            </div>
            <div class="cell button-holder">
                <button type="submit" id="dropdownbutton">
                    <span>Search</span> 
                </button>    
            </div>
        </form>

JavaScript

function action() {
        document.getElementById('dropdownbutton').style.visibility =     'visible';
    }
    
        

---

当浏览器执行

onclick=“…”

事件处理程序中的代码时，它会查找一个名为

action

的引用，该引用可以满足您的事件

由于浏览器“查找”潜在匹配项的方式，它在当前表单（由于它是表单元素）中查找，然后在全局窗口（函数所在的位置）中查找

由于表单具有“action”属性，因此它成为找到的第一个引用。不幸的是，尝试调用它将失败（因为它不是函数/方法）

---

我强烈建议不要命名任何与其他地方使用的非常常见的名称具有相似名称的全局函数。在这种情况下，调用函数

“someAction”

或任何其他名称都可以解决此问题

到底是什么不起作用？在具有“action”的窗体上下文中使用“action”可能会与命名冲突，请尝试将该函数重命名为其他对象，例如“otherAction”@scunliffe-您是正确的，就是这样；我永远不会得到那个；我在扯头发。谢谢lot@cricket_007onclick和onclick的情况都可以。。除非该开发人员禁用了它，否则它将响应单击事件

function action() {
        document.getElementById('dropdownbutton').style.visibility =     'visible';
    }