Question

确定。所以我刚开始使用Prototype JS demo。我的第一个是一个简单的“你好世界”图书馆介绍有点演示。

页面上有两个div。一个是默认隐藏的。

两个按钮调用Prototype JS的show（）和hide（）方法。当您单击“附加”按钮时，隐藏的div是可见的，但是当您在同一个div上单击“删除”（以调用hide（））时，它会隐藏事件的来源，即删除按钮本身而不是预期的div（尽管给$（）函数的ID是正确的）

以下是代码：

<script type="text/javascript">

             document.observe("dom:loaded", function() {


                 alert("loaded");
                 $('mydiv2').hide();

});

             function append()
             {
                 $('mydiv2').show();
             }

             function remove()
             {
                 $('mydiv2').hide();
             }


             </script>

<body>

        <div id='mydiv1'>

            This is my first Prototype Application

        </div>

        <div id='mydiv2'>

            This is appended text

        </div>



        <br/> <br/> <br/>

        <button id="b1" onclick="append();"> Append Text </button> | 
        <button id="b2" onclick="remove();"> Remove Text </button>

    </body>

在这里，当您单击“删除文本”按钮时，它会隐藏按钮本身而不是预期的“mydiv2”div

这就是真正的怪异：在现代浏览器中观察到这个错误（即在Chrome和IE 10上测试时）。但是，在IE7上测试时，它可以正常工作。

这是firebug控制台：

this._cps2 is undefined
[Break On This Error]   

Filtered chrome url chrome://browser/content/browser.js

browser.js (line 1557)

有人可以解释一下这里发生了什么吗？

Answer 1

好的，这就是正在发生的事情。

另一种方法remove() http://api.prototypejs.org/dom/Element/prototype/remove/是实际按钮元素的方法。因为您使用的是直接onclick属性而不是观察者，所以会触发元素的remove方法而不是您的观察者。它在IE 7中“工作”的原因是在IE 7中处理事件的方式。

以下是如何修复它（以及处理事件的规定方法）

首先删除按钮的onclick属性

然后在你的domloaded函数中添加

document.observe('dom:loaded',function(){
    $('b1').observe('click',append);
    $('b2').observe('click',remove);

});

预期的事件行为是你的。

JS提供工作示例 http://jsfiddle.net/sPLmM/

真奇怪的原型JS错误 - hide（）函数不隐藏预期的元素

1 个答案: