|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-12-09
最后修改：2008-12-09
今天上午没事做，在公司拿着买到的 <<prototype与script.aculo.us终极揭秘>>一书看，无意中发现了一个比较有趣的问题，不知道是不是 prototype.js自己的bug，拿上来让各位鉴定一下。
参照prototype.js的官方的api文档，Form.Element.focus(element) -> HTMLElement,他的意思应该是调用这个focus()方法之后返回的是应该是一个被prototye扩张的 HTMLElement,然后可以拿着返回的对象可以继续进行链式调用。可事实上并非如此。我自己测试了一把。下面的代码给的不全。要测试的话需要自己补全。
<script type="text/javascript">
function test_focus()
{
$("clickme").observe("click",function(){
alert(Object.isString(Form.Element.focus('username')))
Form.Element.focus('username').disable().setValue("hahahaha");
});
}
document.observe("dom:loaded",test_focus)
</script>
<body>
<form id="login">
username : <input type="text" id="username" value="hehehehe"><br>
password : <input type="text" id="password"><br>
<input type="button" value="click me" id="clickme"><br>
</form>
</body>
上面的代码运行到alert()部分的时候，会提示true，也就是说他返回的是一个String,然后会报出一个Form.Element.focus("username").disable is not a function的错误。 查看prototype.js的源代码，我们看到这个方法的定义，他其实就是直接返回了传进去的element，根本就没做扩展，所以所谓的链式编程到这里就不能继续下去了。
Form.Element = {
focus: function(element) {
$(element).focus();
return element;
},
select: function(element) {
$(element).select();
return element;
}
};
我直接把它hack掉之后上面的代码就可以正常运行了
Form.Element = {
focus: function(element) {
$(element).focus();
return $(element);
},
select: function(element) {
$(element).select();
return $(element);
}
};
我不知道这是不是prototype.js的bug，我这样的修改也只能说能测试通过我写的demo，所以拿出来供大家谈论一下。 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-12-09
会不会你看的prototype版本和API不对
|
| 返回顶楼 | |
|
发表时间：2008-12-09
xuyao 写道 会不会你看的prototype版本和API不对 我一开始也是这么认为，后来在官方网站下了最新的1.6.0.3都是一样的。 |
| 返回顶楼 | |
|
发表时间：2008-12-14
$('username').focus().disable(); prototype1.5开始更建议直接使用上述形式来调用。 而focus方法的问题应该是因为在从老的版本过度过来的时候没有改完善吧。参考disable方法，在方法开始的地方直接使用： element = $(element); 像lz写的： $(element).focus(); return $(element); 在prototype好像是不建议多次对一个element使用$(),可能存在一些无谓的性能损耗。 |
| 返回顶楼 | |
|
发表时间：2008-12-30
element = $(element); 支持
|
| 返回顶楼 | |
|
发表时间：2009-01-02
最后修改：2009-01-02
不知道lz看的是哪个版本的？
好像不是你这样用的吧
setValue: function(element, value) {
element = $(element);
var method = element.tagName.toLowerCase();
Form.Element.Serializers[method](element, value);
return element;
},
<script src="prototype-1.6.0.3.js" type="text/javascript"> </script>
<script type="text/javascript">
function test_focus()
{
$("clickme").observe("click",function(){
//alert(Object.isString(Form.Element.focus('username')))
Form.Element.disable('username');
Form.Element.setValue('username',"hahahaha");
});
}
document.observe("dom:loaded",test_focus)
</script>
<body>
<form id="login">
username : <input type="text" id="username" value="hehehehe"><br>
password : <input type="text" id="password"><br>
<input type="button" value="click me" id="clickme"><br>
</form>
</body>
|
| 返回顶楼 | |
|
发表时间：2009-01-02
ls的好像没有完全理解我说的意思啊。
|
| 返回顶楼 | |
|
发表时间：2009-01-02
prototype并没有告诉你Form.Element.focus(element)返回的对象是被prototype加强过的，只是你个人的猜测而已。
事实上，类似像focus这样的函数，只是为了做焦点定位，继续使用其返回值的场景很少。所以返回值也不应该变成一个加强过的对象。 不要动不动就说是框架的bug，我认为还是先动动脑筋别人为什么要这样实现为好。 |
| 返回顶楼 | |
|
发表时间：2009-01-02
最后修改：2009-01-02
downpour 写道 prototype并没有告诉你Form.Element.focus(element)返回的对象是被prototype加强过的，只是你个人的猜测而已。
事实上，类似像focus这样的函数，只是为了做焦点定位，继续使用其返回值的场景很少。所以返回值也不应该变成一个加强过的对象。 不要动不动就说是框架的bug，我认为还是先动动脑筋别人为什么要这样实现为好。 我参考的是prototype-160-api.pdf官方文档，文档里写的是focus(element) -> HTMLElement。我没有说是它的错误。但是文档和实现确实不一致。 focus(element) -> HTMLElement Gives keyboard focus to an element. Form.Element.focus('searchbox') // Almost equivalent, but does NOT return the form element // (uses the native focus() method): $('searchbox').focus() |
| 返回顶楼 | |
|
发表时间：2009-01-03
zy8643954 写道 downpour 写道 prototype并没有告诉你Form.Element.focus(element)返回的对象是被prototype加强过的，只是你个人的猜测而已。
事实上，类似像focus这样的函数，只是为了做焦点定位，继续使用其返回值的场景很少。所以返回值也不应该变成一个加强过的对象。 不要动不动就说是框架的bug，我认为还是先动动脑筋别人为什么要这样实现为好。 我参考的是prototype-160-api.pdf官方文档，文档里写的是focus(element) -> HTMLElement。我没有说是它的错误。但是文档和实现确实不一致。 focus(element) -> HTMLElement Gives keyboard focus to an element. Form.Element.focus('searchbox') // Almost equivalent, but does NOT return the form element // (uses the native focus() method): $('searchbox').focus() focus(element) -> HTMLElement就代表返回的对象就必须要被prototype加强嘛？这纯粹是你的理解。 我们来看看另外一个Element的方法，prototype的文档是怎么说的： 引用 down(element[, cssRule][, index = 0]) -> HTMLElement | undefined The Element.down method is part of Prototype’s ultimate DOM traversal toolkit (check out Element.up, Element.next and Element.previous for some more Prototypish niceness). It allows precise index-based and/or CSS rule-based selection of any of the element’s descendants. As it totally ignores text nodes (it only returns elements), you don’t have to worry about whitespace nodes. And as an added bonus, all elements returned are already extended allowing chaining 如果返回的HTMLElement支持chaining，并被prototype加强，在文档中自会详细说明。 对于focus这种方法，文档中本身就没有提到支持chaining。从这个方法的语义本身来说，也不需要支持chaining，因为在调用focus这个函数之后，几乎没有场景需要让其进行后续操作。 |
| 返回顶楼 | |
